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

Question

我在我的 Angular 6 应用程序中使用 Enterprise Ag-Grid 版本。我有一个Set Filter。我在过滤器中添加了“应用”按钮：

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 的一部分

所以这个函数可以在自定义过滤器like here中访问。

所以你应该做的就是在里面定义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() 将关闭您的过滤器；

我根据引用的演示制作了dummy sample