Saya baru saja mulai bekerja dengan AngularJS dan saya mencoba mengatasinya. Sepertinya saya mengambil banyak kebiasaan buruk dari jQuery. Saya memiliki halaman seluler sederhana yang ditulis menggunakan Onsen UI/AngularJS dan jQuery. Konten yang saya inginkan ditampilkan dengan benar, namun saya tidak dapat menelusuri konten sampai akhir. Kode HTML saya untuk halaman tersebut adalah sebagai berikut
<ons-navigator title="Navigator" var="appNavigator">
<ons-page>
<ons-toolbar>
<div class="left">
<ons-button style="background-color: white;color: #d00052;"
ng-click="appNavigator.resetToPage('home.html', options);"><i class="fa fa-home fa-2"></i>
</ons-button>
</div>
<div class="center">Notice Board</div>
<div class="right">
<ons-button style="background-color: white;color: #d00052;"
ng-click="appNavigator.resetToPage('login.html', options);"><i
class="fa fa-power-off fa-2"></i></ons-button>
</div>
</ons-toolbar>
<ons-scoller>
<ons-list ng-controller="MyCtrl">
<div ng-repeat="group in groups" style="z-index: 9999;">
<ons-list-item ng-click="toggleGroup(group)" class="title" ng-class="{active:isGroupShown(group)}">
<ons-icon icon="minus-square-o" ng-if="isGroupShown(group)"></ons-icon>
<ons-icon icon="plus-square-o" ng-if="!isGroupShown(group)"></ons-icon>
<b>{{group.title}}</b>
</ons-list-item>
<ons-list-item class="item-accordion" ng-show="isGroupShown(group)">
<p style="line-height: 22px;" ng-bind-html="group.content">...</p>
</ons-list-item>
</div>
</ons-list>
</ons-scoller>
</ons-page>
</ons-navigator>
Pengontrol saya untuk halaman ini adalah sebagai berikut
app.controller('MyCtrl', function($scope) {
$scope.groups = [];
$.ajax({
type: 'GET',
url: 'https://mywebsite/service?mode=data',
dataType: 'jsonp',
timeout: 5000,
success: function(data) {
$scope.groups = data;
$scope.$apply();
},
error: function(data) {
$scope.error = true;
$scope.$apply();
}
});
$scope.toggleGroup = function(group) {
if ($scope.isGroupShown(group)) {
$scope.shownGroup = null;
} else {
$scope.shownGroup = group;
}
};
$scope.isGroupShown = function(group) {
return $scope.shownGroup === group;
};
});
Saya pikir karena kode html menggunakan ons-scroller - kode itu akan bergulir dengan benar (di iPhone) tetapi ternyata tidak. Saya mengkompilasi aplikasi menggunakan PhoneGap Build pada versi 3.5.0. Apa yang kulewatkan di sini? Saya akan sangat berterima kasih atas saran atau bimbingan apa pun.
