在剑道时间选择器中选择时间时，剑道 UI Angular 过滤器菜单会自动关闭

Posted 2023-05-07

【中文标题】在剑道时间选择器中选择时间时，剑道 UI Angular 过滤器菜单会自动关闭

【英文标题】：Kendo UI Angular filter menu automatically closes when selecting a time in kendo timepicker

【发布时间】：2019-06-15 21:00:08

【问题描述】：

我最近开始使用 Angular 使用 Kendo UI 网格。

经过一些测试，我发现缺少 timepicker 过滤器菜单组件，并决定自己制作。

问题是当我在模板中使用剑道 UI 时间选择器并选择时间时，过滤器菜单会自动关闭。

这里是重现该问题的堆栈闪电战：

https://stackblitz.com/edit/kendo-ui-angular-grid-filter-menu-kendo-timepicker-issue?file=app/app.component.ts

一个小提示：我在自定义 TimeComponent 中扩展 DateFilterMenuComponent 的原因是我有与日期相关的值相同的运算符，这没关系，并且可以轻松访问到其他常见的过滤器属性（示例逻辑运算符）。

有人可以帮我解决选择时间时菜单不关闭的问题吗？

到目前为止，我尝试了以下方法：

在我尝试过的时间选择器上

(click)="$event.preventDefault(); $event.stopPropagation()"

这导致时间选择器没有关闭，但过滤器菜单仍然关闭。

【参考方案1】：

我在联系 Telrik 支持后找到了答案，他们指点我

https://www.telerik.com/kendo-angular-ui/components/grid/filtering/reusable-filter/#toc-filter-menu-with-popup

问题在于时间选择器正在主体/根组件中呈现，并且过滤器菜单（默认情况下）配置为在用户单击过滤器菜单内容之外时关闭。

这是与我在 stackblitz 中修复的问题混合在一起的文档：

https://stackblitz.com/edit/kendo-ui-angular-grid-filter-menu-kendo-timepicker-issue-vzitmn?file=app/filters/menu/time/time.component.ts