使用ngGrid V2.X，我试图发展Deng加载更多的数据网格时，页面滚动（未电网滚动）进入底部。

Using ngGrid v2.X, I'm trying to devolop a grid that loads more data when page scroll (not grid scroll) goes bottom.

通过搜索类似的问题我已经找到了解决我的第1题： ngGrid必须有动力高度，所以我这样做

By searching for similar questions i've found a solution to my 1st problem: ngGrid must have dynamic height, so i've did this

.ngViewport{ height:auto !important; } .ngCanvas, .ngViewport, .ngRow, .ngFooterPanel, .ngTopPanel { width: 100% !important; } .ngRow { border-bottom:none !important; }

这需要我的我的第二个问题我需要的数据是通过滚动加载，我发现： ngGridEventScroll ，但0 NLY时触发ngGrid实习生滚动使用，我需要的页面滚动

Which takes me to my 2nd problem. I need data be loading by scroll, and i've found: ngGridEventScroll, but only triggers when ngGrid intern scroll is used, i need page scroll

  $scope.$on('ngGridEventScroll', function () {
        $scope.currentDataPosition++;
        $scope.setPagingData($scope.dataArray, $scope.currentDataPosition, $scope.pagingOptions.pageSize);
    });

所以，解决方案1，打破了解决方案2，因为ngGridEventScroll可是没有实习生滚动了。

So, solution 1, breaks the solution 2, because ngGridEventScroll doesnt have the intern scroll anymore.

 $scope.setPagingData = function (data, page, pageSize) {
        cfpLoadingBar.start();
        var pagedData = data.slice((page - 1) * pageSize, page * pageSize, page * pageSize);
        $scope.totalServerItems = data.length;
        $scope.myData = pagedData;
        cfpLoadingBar.complete();
    };

 $scope.gridOptions = {
        data: 'myData',
        virtualizationThreshold: 50,
        enableRowSelection: false,
        enablePaging: false,
        enableSorting: false,
        showFooter: false,
        pagingOptions: $scope.pagingOptions,
        filterOptions: $scope.filterOptions,
    }

可以做些什么？

推荐答案

您可以使用ngInfiniteScroll（ HTTPS ：//sroze.github.io/ngInfiniteScroll/index.html ），并应用了以下策略。

You could use ngInfiniteScroll (https://sroze.github.io/ngInfiniteScroll/index.html) and apply the following strategy.

在控制器

    $scope.limit = 50; // Initial limit (make sure its enough to cover the whole page, otherwise the raiseLimit function might not be called)
    $scope.raiseLimit = function() { // function called by ngInfiniteScroll
         if ( $scope.limit < data.length) {
             $scope.limit += 10; // adjust to your need
         } else {
             $scope.dataLoaded = true;
         }
    }
    $scope.dataLoaded = false; // prevent useless call
    $scope.myData = $filter('limitTo')(data, $scope.limit); // Do not forget to inject $filter into your controller

在你的HTML

    <div infinite-scroll='raiseLimit()' infinite-scroll-disabled='dataLoaded'>
        <!-- put your grid with dynamic height here -->
    </div>