ui-grid enableSelectAll和paginationPageSize

Question

我有一个网格，我希望给出10的分页大小，我想选择所有选项来限制行选择只有10，但给定此配置，它会选择整个数据集页面。

$scope.gridEvents = { 
    enableSorting :   true, 
    enableSelectAll:   true, 
    enableColumnResize:  true, 
    enablePaginationControls: false, 
    rowHeight:    27, 
    enableScrollbars :  true, 
    paginationPageSize :  10 
} 

任何帮助表示赞赏

Answer 1

请尝试如下图所示。

工作Plunker

JS

$scope.gridOptions = { 
    paginationPageSizes: [10, 20, 30], 
    paginationPageSize: 10, 
    useExternalPagination: true, 
    enableRowSelection: true, 
    enableSelectAll: true, 
    totalItems: 100, 
    columnDefs: [ 
     { name: 'name' }, 
     { name: 'gender' }, 
     { name: 'company' } 
    ], 
    onRegisterApi: function(gridApi){ 
     $scope.gridApi = gridApi; 
     $scope.gridApi.pagination.on.paginationChanged($scope, function(currentPage, pageSize){ 
     $scope.getPage(currentPage, pageSize); 

     }); 
    } 
    }; 

$scope.getPage = function(pageNumber, pageSize){ 
    var startingRow = pageSize * (pageNumber - 1); // page number starts at 1, not zero 
    $http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/100.json') 
    .success(function (data) { 
     var newData = []; 
     for(var i = startingRow; i < startingRow + $scope.gridOptions.paginationPageSize; i++) { 
     newData.push(data[i]); 
     } 
     $scope.gridOptions.data = newData; 
    }); 
    }; 

    $scope.getPage(1, 10); 

的Html

<div ui-grid="gridOptions" ui-grid-pagination ui-grid-selection class="grid"></div>