什么可以方便地实现Angular ui网格的外部过滤器

时间:2015-04-21 03:11:23

标签: angularjs angular-ui-grid

在第50行source code处说:

/**
           * @ngdoc event
           * @name filterChanged
           * @eventOf  ui.grid.core.api:PublicApi
           * @description  is raised after the filter is changed.  The nature
           * of the watch expression doesn't allow notification of what changed,
           * so the receiver of this event will need to re-extract the filter 
           * conditions from the columns.
           * 
           */
          this.registerEvent( 'core', 'filterChanged' );

就我而言,我people table有三列,NameSurnameEmail。我可以处理filterChanged:

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

发送我的所有参数服务器端并在所有字段中搜索。

这可能适用于少数几列。 See plunker

对于庞大的桌子,客户端可以方便地处理什么?

在@PaulL的回答的帮助下,我达到了这个解决方案:

vm.gridApi.core.on.filterChanged($scope, function () {
    var grid = vm.gridApi.grid;
    var filters = [];
    vm.gridApi.grid.columns.forEach(function (column) {
        if (column.filters && column.filters[0].term) {
            filters[column.name] = column.filters[0].term;
        };
    });
    console.log(filters);
    service.getEntries(filters, paginationOptions.pageNumber, paginationOptions.pageSize, paginationOptions.sortDir).
    then(function (result) {
        vm.gridOptions.data = result.data.value;
    })
});

1 个答案:

答案 0 :(得分:0)

通常我只是使用以下方法提取它们:

var filters = [];
$scope.gridApi.grid.columns.forEach( function(column) {
  if( column.filters && column.filters.length > 0 ) {
    filters.push({name: column.name, filters: column.filters});
  };
});

然后,您可以在发送到服务器之前根据需要处理这些过滤器。我通常也会去掉过滤器,你不想用每个按键调用服务器。