在 ui-grid 中分页显示选定的行数

Question

我在我的项目中使用ui-grid，我需要在分页部分显示selected行索引值。

比如我的grid中共有100个item，分为4页，每页25个item。如果我 select 页面的第 10 行，我需要显示 10 项，共 25 项

我正在使用：

HTML

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

控制器：

  $scope.gridOptions ={

  data:'data',
  coulmnDef: $scope.coulmnDef,
  paginationPageSizes: [25, 50, 75,100],
  paginationPageSize: 25,

};

你能帮帮我吗，先谢谢了

Answer 1

您可以通过侦听 rowSelectionChanged 事件来获取选定的行，之后您可以在 gridApi 的 selection 对象上使用 getSelectedRows 方法。为此，请将以下内容添加到您的 gridOptions 对象中：

$scope.selection = [];

$scope.gridOptions = {
    enableRowSelection: true,
    enableRowHeaderSelection: false,
    modifierKeysToMultiSelect: true,
    multiSelect: true,
    onRegisterApi: function (gridApi) {
        $scope.gridApi = gridApi;
        gridApi.selection.on.rowSelectionChanged($scope, function () {
            $scope.selection = gridApi.selection.getSelectedRows();
        });
    }
};

现在，每次选择更改时，范围内的 selection 数组都会更新，您可以使用 length 属性来获得选择计数。希望对你有帮助，祝你好运！

参考：http://ui-grid.info/docs/#/tutorial/210_selection

在 ui-grid 中分页显示选定的行数

Show selected row count in pagination in ui-grid

pagination

angularjs

angular-ui-grid