Question

我正在寻找有关如何继续的建议，并希望了解是否有人实施了类似的要求。请提供一些有关潜在方法的建议。我有一个角度ui网格，稍微更改一下，用复选框替换OK按钮。它的工作正常点击＆＃34;选择所有＆＃34;它选择UI网格中的所有行。但我希望将选择范围扩大到分页中的当前页面。选择应在页面移动时保留。
用户选择第1页＆＃34;选择所有复选框＆＃34;。然后转到第2页，可能会选择＆＃34;选中所有复选框＆＃34;。此时应选择Page 1和Page 2。可能会有超过所选择的2个页面，但只应选择选中所有选中的页面。

感谢您抽出时间阅读并提供建议

这是一个带有分页和复选框的Plunker链接。

    [http://plnkr.co/edit/Ji7gLbfQTohnEj04mYFM?p=preview][1]

非常感谢

Answer 1

选择可见行并限制选择：

为了检测页面上所有行的选择：

<{1}}中的

enableSelectionBatchEvent应设置为true。

gridOptions

$scope.gridOptions.onRegisterApi = function(gridApi){ //set gridApi on scope $scope.gridApi = gridApi; // detect bulk selection gridApi.selection.on.rowSelectionChangedBatch($scope,function(rows){ //logic to save the selected visible rows. }); public api提供了一个名为ui.grid.selection的方法，它只选择可见的行

一旦此选择范围受限，您就可以使用UI网格提供的selectAllVisibleRows(event)功能 saveState提供名为gridOptions的属性，该属性将当前选定的行和默认值保存为true

导航到第2页后，您应该保存这样的数据 -

保存数据：

saveSelection

在加载第2页时，您应该恢复这样的数据 -

恢复已保存的数据：

 $scope.state = {};
 $scope.state = $scope.gridApi.saveState.save();

请按照这些教程了解详情：
Selecting rows
Save Selection

Answer 2

是的，ui-grid v4.4.9 API有一个selectAllVisibleRows（event）方法。不幸的是，它认为所有未过滤的行都是可见的。它不排除未在当前网格页面上呈现的行。因此，我们被迫将事情掌握在自己手中：

        onRegisterApi: function (gridApi) {

            gridApi.selection.on.rowSelectionChangedBatch(null, function (rows) {
                var grid = this.grid;
                // you'll need ui-grid v4.4.9 or better 
                // otherwise you'll need to invert getSelectAllState()
                // as explained at https://github.com/angular-ui/ui-grid/issues/5411
                var isAllSelected = grid.api.selection.getSelectAllState();
                // when select all is checked, the default behavior is to select all grid rows on all pages
                // so we have to deselect them all first before we select just the ones on the visible page
                grid.api.selection.clearSelectedRows(null);
                if (isAllSelected) {
                    // select only the rows displayed in the current grid page
                    var startIndex = (grid.options.paginationCurrentPage - 1) * grid.options.paginationPageSize;
                    var endIndex = startIndex + grid.options.paginationPageSize;
                    for (let i = startIndex; i < endIndex; i++) {
                        let row = grid.rows[i];
                        row.isSelected = true;
                    }
                }
            });
        },

ui-grid选择all将范围限制为当前页面

2 个答案: