ui-grid enableSelectAll 和 paginationPageSize

Question

我有一个网格，我希望分页大小为 10，我想 select 所有选项将行 selection 限制为仅 10，但鉴于此配置，它 selects 所有页面的整个数据集。

$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>

ui-grid enableSelectAll 和 paginationPageSize

ui-grid enableSelectAll and paginationPageSize

javascript

angularjs

grid

angular-ui-grid

ng-grid