如何从分页的 ui-grid 中获取过滤的数据 [英] How to Get Filtered data from paged ui-grid

问题描述

当启用分页功能时，我想从 ui-grid 中获取过滤后的数据.在一般情况下，我使用

I'd like to get filtered data from a ui-grid when the paging feature is enabled. In general case I used

 $scope.gridApi.core.on.filterChanged($scope, function () {

                if ($scope.gridApi.grid.columns[1].filter.term != "" && $scope.gridApi.grid.columns[1].filter.term != undefined) {
                    var dd =$scope.gridApi.core.getVisibleRows($scope.gridApi.grid);
                    console.log(dd);
            });

但是当启用分页时代码不能正常工作，它只返回第一页的行.但我需要所有过滤后的数据.

but the code doesn't work well when the paging is enabled, it return only rows of the first page. but I need all the filtered data.

最简单的解决方案是根据过滤条件过滤数据源，但它会显着降低性能.

the easiest solution is filter data source based on the filter term but it decreases the performance dramatically.

有什么建议吗?

推荐答案

注意: 我没有尝试分页，只是分组，但希望它能给你一个提示.


尝试将 rowsVisibleChanged 事件与 filterChanged 事件一起使用.您必须同时使用两者，因为如果单独使用 filterChanged 事件，它将无法工作，因为它在实际过滤行之前启动.我使用标志变量 (filterChanged) 来了解过滤器是否被修改.

Note: I didn't try it with pagination, just grouping, but hope it gives you a hint.


Try using the rowsVisibleChanged event together with the filterChanged event. You have to use both because if you use the filterChanged event alone it won't work since it's launched before the rows are actually filtered. I use a flag variable (filterChanged) to know if a filter was modified.

然后，使用诸如 lodash 之类的东西来过滤 $scope.gridApi.grid.rows将 visible 属性设置为 true 的 :

Then, use something like lodash to filter the $scope.gridApi.grid.rows that have the visible property set to true:

// UI-Grid v.3.0.7
var filterChanged = false;

$scope.gridApi.core.on.filterChanged($scope, function() {
    filterChanged = true;
});

$scope.gridApi.core.on.rowsVisibleChanged($scope, function() {
    if(!filterChanged){
        return;
    }
    filterChanged = false;
    // The following line extracts the filtered rows
    var filtered = _.filter($scope.gridApi.grid.rows, function(o) { return o.visible; });
    var entities = _.map(filtered, 'entity'); // Entities extracted from the GridRow array
});

这篇关于如何从分页的 ui-grid 中获取过滤的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！