angular - 直到交互才创建 Ag Grid 自定义过滤器

Question

我在我的网格中的列上有一个自定义过滤器组件。我注意到在单击列标题中的筛选器图标之前，不会构建筛选器组件。这意味着数据没有根据我的默认设置进行过滤(例如，过滤掉 status == StatusEnum.Complete 的记录)。

作为变通方法，我发现我可以通过调用 api.getFilterInstance('status') 在 onGridReady 事件中获取过滤器实例，这会导致要创建的过滤器组件，从而应用默认过滤。

这个解决方法似乎有点笨拙。 filter 变量未在 onGridReady 事件中使用，这会导致 IDE/构建中出现警告。另一个开发人员可能认为没有必要删除这行代码。

是否有更好的方法来强制在创建网格时实例化我的自定义过滤器？我使用的是 AgGrid 17.1 和 Angular 4.4。

网格配置如下:

gridOptions: GridOptions = {
    enableFilter: true,
    onGridReady: (event) => {
        let filter = event.api.getFilterInstance("status"); // forces the filter component to be constructed
        let data = this.loadAsyncData();
        event.api.setRowData(data);
    },
    columnDefs: [
    ...
    {
        headerName: "Status",
        field: "status",
        filterFramework: MyCustomStatusFilterComponent,
        filterParams: {
            valueGetter: (obj) => { return obj.data.statusEnum; },
            hideCompleteByDefault: true,
            ...
        }
    },
    ....
    ]
}

我设置了一个 example that demonstrates the issue .请注意 app.component.ts 第 63 行的“hack”。

Answer 1

首先 - 它是两个独立的东西，自定义过滤器和过滤器初始化。

我想您已经混合了这两个阶段并试图获得意想不到的结果。

您的自定义过滤器不应包含预定义逻辑因为 init 只会在第一次触摸您的过滤器时发生，您必须划分逻辑然后在 onGridReady 你可以用需要的东西执行 setModel。或者像你已经提到的那样保持黑客