按下“应用”按钮后，Ag-Grid 隐藏迷你过滤器

Question

我在 Angular 6 应用程序中使用 Enterprise Ag-Grid版本。我里面有一个设置过滤器。我向过滤器添加了“应用”按钮：

apply：设置为 true 以包含带有过滤器的“应用”按钮，并且不会在选择更改时自动过滤。

问题是按下按钮后如何隐藏迷你过滤器菜单？我在官方网站上没有找到任何有关这种可能性的文档。但我在内部库 src 文件中找到一条注释，在以下位置指定IComponent.ts：

 /* A hook to perform any necessary operation just after the gui for this component has been renderer
 in the screen.
 If the filter popup is closed and reopened, this method is called each time the filter is shown.
 This is useful for any
 logic that requires attachment before executing, such as putting focus on a particular DOM
 element. The params has one callback method 'hidePopup', which you can call at any later
 point to hide the popup - good if you have an 'Apply' button and you want to hide the popup
 after it is pressed. */
afterGuiAttached?(params?: IAfterGuiAttachedParams): void;

目前我不明白如何设置afterGuiAttached功能来实现上述目标。

有人可以帮助我吗？
提前致谢！

Answer 1

正如您已经检查过的afterGuiAttached那样Filter Component

所以这个函数可以在自定义过滤器中访问，如下所示。

所以你应该做的就是afterGuiAttached在里面定义：

export class PartialMatchFilter implements IFilterAngularComp {
    afterGuiAttached(params){
        params.hidePopup() <- executing will close the filter
    }
}

afterGuiAttached- 将按照描述执行init（但“应用”按钮也将是自定义的，您应该自行处理）。您可以将hidePopup函数绑定到自定义过滤器参数，并在需要时使用它。

export class PartialMatchFilter implements IFilterAngularComp {
    private hideFilter:Function;

    afterGuiAttached(params){
        this.hideFilter = params.hidePopup;
    }
}

执行this.hideFilter()将关闭你的过滤器；

我根据引用的演示制作了一个虚拟示例