javascript - 自定义过滤器：我可以为过滤器设置自定义按钮吗？

Question

我正在尝试在ag-grid angular上拥有自己的自定义过滤器。
除了Apply按钮之外，我还想要过滤器的其他按钮。即，如果我可以在某种 UI 中解释这一点，

|--自定义过滤器-------------------.
| 过滤文本：_____________ |
| Apply| Clear| Clear All|
|_______________________|

通过使用 的默认过滤器组件ag-grid，我知道如果我filterParams在ColDef.

filterParams: {
    applyButton: true,
    clearButton: true
}

但是另一个自定义 ( Clear All) 按钮呢？有什么办法可以实现吗？

Answer 1

经过几个小时的搜索和试错后实现了它。

看看这里给出的例子：ag-Grid Angular Custom Filter Component 看看PartialMatchFilterComponent它的代码。

在模板和组件的一些代码更新之后，我们可以实现它。

更新模板：

<button (click)="apply()">Apply</button>
<button (click)="clear()">Clear</button>
<!-- any other buttons you want to keep -->

组件代码中的小更新：只需要this.params.filterChangedCallback()在Apply按钮单击时调用。

apply(): void {
    this.params.filterChangedCallback();
}
clear(): void {
    this.text = '';
    this.params.filterChangedCallback();
}
onChange(newValue): void {
    if (this.text !== newValue) {
        this.text = newValue;
        // this.params.filterChangedCallback(); - remove
    }
}