如何设置ng-grid的pagingOptions

时间:2014-07-21 07:55:59

标签: angularjs ng-grid

我在页面中使用了ngGrid。第一次或页面加载时间我有渲染ng-grid没有set pagination选项。之后我想通过单击按钮设置分页选项。怎么可能?

$scope.persons = [{ name: "Moroni", age: 50 },
          { name: "Tiancum", age: 43 },
          { name: "Jacob2", age: 27 },
          { name: "Jacob3", age: 27 }];
    $scope.gridOptions = {
    data: 'persons',
    plugins: [new ngGridFlexibleHeightPlugin()]
};

我在html页面设置了ng-grid。

现在我想在点击show pager按钮后显示ng-grid寻呼机。我该怎么办?

$scope.ShowPager= function () {
     $scope.pagingOptions = {
         pageSizes: [10, 20, 30, 500, 1000, 5000], //page Sizes
         pageSize: 10, //Size of Paging data
         currentPage: 1 //what page they are currently on
     };
     $scope.gridOptions.pagingOptions = $scope.pagingOptions;

     $scope.gridOptions.showFooter = true;

     $scope.gridOptions.enablePaging = true;

     $scope.gridOptions.totalServerItems = 'totalServerItems';
}

1 个答案:

答案 0 :(得分:0)

这就是我设定它的方式......

            gridOptions.pageOptions = {
                pageSizes: [20, 50, 100, 200, 500, 1000],
                pageSize: 20,
                currentPage: 1,
                totalServerItems: 0
            };

            gridOptions.pagingOptions = gridOptions.pageOptions;

为什么我这样做..我不知道,但它的工作......

可能是角度和早期的早期复制粘贴效果:)

修改

启用分页按钮点击执行

$scope.gridOptions.enablePaging = false; //disable by default

$scope.enablePaging = function(){
       $scope.gridOptions.enablePaging = true;
}

<button ng-click="enablePaging()"></button>