如何在内容加载完成时停止 ui-grid 的无限滚动？

Question

我正在使用 ui-grid。我已经实现了一些逻辑来停止 $http 调用，如下所示。但是当它到达最后一个结果时，滚动条会跳到最后一个结果之前很少的那一行。所以用户无法随时看到最后的结果。如果用户再次滚动然后过了一会儿它再次跳转到最后结果之前的几行。

我使用了以下逻辑。

$scope.loadMoreData = function() {
         var promise = $q.defer();
         if($scope.lastPage < $scope.maxPage){
         $timeout(function () {
           var arrayObj = [];
           for(var i=0; i<$scope.itemsPerPage; i++){
             arrayObj.push({id:Math.random()*100, name:'Name '+Math.random()});
           }
           $scope.lastPage++;
           $scope.data = $scope.data.concat(arrayObj);
           $scope.gridApi.infiniteScroll.dataLoaded();
               console.log($scope.data);
               promise.resolve();
         }, Math.random()*1000);
         }
         else {
           $scope.gridApi.infiniteScroll.dataLoaded();
           promise.resolve();
         }
         return promise.promise;
      }

这里是 plunker，我使用 $timeout 来替换 $http 调用以便于复制。

这是我在实现无限滚动时遇到的另一个。

注意：我已经用谷歌搜索了很多。

Answer 1

当我几个月前开始使用 ui-grid 时，无限滚动是刚刚实现的，我遇到了和你一样的问题。但是这些人正在努力改进，当使用最新版本的 ui-grid 时，无限滚动就像一个魅力！

我 updated your Plunkr 使用最新的 ui-grid 版本，一切正常。

<script src="http://ui-grid.info/release/ui-grid.js"></script>

如何在内容加载完成时停止 ui-grid 的无限滚动？

How to stop infinite scrolling of ui-grid while content loading finish?

javascript

angularjs

infinite-scroll

angular-ui-grid