当用户滚动窗口时关闭 Mat-menu答案

【问题标题】：Close Mat-menu when user scrolls the window当用户滚动窗口时关闭 Mat-menu
【发布时间】：2019-09-29 00:29:47
【问题描述】：

问题：当窗口滚动到导航菜单顶部时，mat-menu 不应该可见，

原因：由于z-index in .cdk-overlay-container 高而上升

我已经关注了

file.ts

@ViewChild(MatMenuTrigger) trigger: MatMenuTrigger; 
@HostListener('window:scroll', [])
scrollHandler() {
if (this.trigger) {
this.trigger.closeMenu();
 }
 }

但这仅适用于 6 个中的第一个 mat-menu，其余不关闭滚动！！！！！

Angular Cli Version

【问题讨论】：

标签： angular angular-material angular7 angular-material2 viewchild

【解决方案1】：

 @ViewChildren(MatMenuTrigger) trigger: QueryList<MatMenuTrigger>;
 @HostListener('window:scroll', [])
 scrollHandler() {
     for (let index = 0; index < this.trigger.toArray().length; index++) {
   this.trigger.toArray()[index].closeMenu();
 }

这将访问组件内的所有垫子菜单，循环将遍历每个索引并关闭打开的菜单。

【讨论】：