1
我的無限滾動不起作用的第二次。我的意思是它第一次加載數據時滾動,加載後它也將數據附加到我的數據集,但再次如果我滾動然後它不會調用我的加載方法。角度ui.grid無限滾動不被稱爲第二次的onwords
附加Plunker here。用$超時刪除$ http代碼,以便在plunker上重現問題。 $超時也同樣的問題仍然存在。
var app = angular.module('plunker', ['ui.grid', 'ui.grid.infiniteScroll']);
angular.module('plunker').controller('ListController',ListController);
ListController.$inject = ['$scope', '$timeout', '$q'];
function ListController ($scope, $timeout, $q) {
\t $scope.itemsPerPage = 20;
\t $scope.lastPage = 0;
\t $scope.data = [];
\t
\t var request = {"startAt" : "1","noOfRecords" : $scope.itemsPerPage};
\t
\t $scope.gridOptions = {
\t \t infiniteScrollDown: true,
\t \t columnDefs: [
\t \t { field: 'id', name:'ID'},
\t \t { field: 'name', name:'My Name'}
\t \t ],
\t \t data: 'data',
\t \t onRegisterApi: function(gridApi){
\t \t gridApi.infiniteScroll.on.needLoadMoreData($scope, $scope.loadMoreData);
\t \t $scope.gridApi = gridApi;
\t \t }
\t \t };
\t
\t \t
\t $scope.loadMoreData = function() {
\t var promise = $q.defer();
\t $timeout(function() {
//Sample Data Creation Start
\t var arrayObj = [];
\t for(var i=0; i<$scope.itemsPerPage; i++){
\t arrayObj.push({id:Math.random()*100, name:'Name '+Math.random()});
\t }
//Sample Data Creation End
\t $scope.data = $scope.data.concat(arrayObj);
\t \t \t console.log($scope.data);
\t \t \t promise.resolve();
\t }, Math.random()*1000);
\t return promise.promise;
\t };
\t \t
\t \t $scope.loadMoreData();
}
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="https://cdn.rawgit.com/angular-ui/bower-ui-grid/master/ui-grid.min.css" type="text/css" />
<script data-require="[email protected]" src="https://code.angularjs.org/1.3.20/angular.js" data-semver="1.3.20"></script>
<script src="https://cdn.rawgit.com/angular-ui/bower-ui-grid/master/ui-grid.min.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="ListController">
<div data-ui-grid="gridOptions" class="grid" data-ui-grid-infinite-scroll></div>
</body>
</html>
看來我失蹤1向下滾動負荷後一些事件附件。 請幫忙。
謝謝,您的建議工作良好。但是,我面臨一個新問題,而我的所有內容完成加載滾動條不會停留在最後的結果。它跳轉到最後的幾個結果。這是我發佈的另一個相關問題。 http://stackoverflow.com/questions/33665641/how-to-stop-infinite-scrolling-of-ui-grid-while-content-loading-finish –