如何在Ag-Grid中预设列过滤器

Question

我有一个Ionic/Angular使用的应用程序ag-grid。我希望某些网格在加载网格时自动应用过滤器-无需用户做任何事情。

我尝试了以下方法：

onGridReady(params) {
  params.api.sizeColumnsToFit();
  // get filter instance
  var filterComponent = params.api.getFilterInstance("isActive");
  // OR set filter model and update
  filterComponent.setModel({
    type: "greaterThan",
    filter: 0
  });
  filterComponent.onFilterChanged();
}

但是什么也没做。有任何想法吗？

Answer 1

在他们的几个例子中重现了您的问题，似乎可以通过增加一些延迟来缓解。只是猜测一下，虽然网格已经准备就绪，但DOM可能尚未完全准备好。

固定：

onGridReady(params) {
params.api.sizeColumnsToFit();

setTimeout(() => {
    var filterComponent = params.api.getFilterInstance("isActive");
    filterComponent.setModel({
      type: "greaterThan",
      filter: 0
    });
    filterComponent.onFilterChanged();
    },150)
}

Answer 2

我认为问题是，当加载新行时，网格会重置过滤器。有多种方法可以解决这个问题：

1. 预定义的过滤器类型有一个名为newRowsAction的过滤器参数
   https://www.ag-grid.com/javascript-grid-filter-text/#params

   newRowsAction：加载新行时要做什么。默认是重置过滤器。如果要在行加载之间保持过滤器状态，请将此值设置为“保持”。

2. 这个答案建议设置gridOptions属性deltaRowDataMode=true

3. 您还可以收听网格日期更改时发出的网格事件之一，然后应用过滤器 https://www.ag-grid.com/javascript-grid-events/#miscellaneous：rowDataChanged, rowDataUpdated

当数据更改时，这些都应该保留过滤器，但我认为如果您只希望在第一次加载时过滤器，您仍然需要一些额外的逻辑（设置标志）。

Answer 3

我最终做到了。

var FilterComponent = gridOptions.api.getFilterInstance('Status');
FilterComponent.selectNothing(); //Cleared all options
FilterComponent.selectValue('Approved')  //added the option i wanted
FilterComponent.onFilterChanged();