简体   繁体   English

如何随着页面滚动“ Angular Material”菜单弹出窗口?

[英]How to scroll Angular Material mat-menu popup along with the page?

After the mat-menu is triggered and items are shown, the popup elements are not scrolling along with the page. 触发菜单菜单并显示项目后,弹出元素不会随页面滚动。 Instead they seem to be broken from the mat-menu icon and they are always visible as I scroll the page. 取而代之的是,它们似乎从Mat-menu图标中消失了,并且在我滚动页面时始终可见。

<mat-icon class="mat-accent" [matMenuTriggerFor]="menuOptions">menu</mat-icon> 

<mat-menu #menuOptions="matMenu"> <button mat-menu-item *ngFor="let menuItem of menuItems" (click)=selectMenuItem(menuItem)> {{menuItem.text}}</button> </mat-menu>

As shown in below picture, even though the initial menu-items popup appeared correctly, as I scroll the page, the popup elements are no longer attached to the above hamburger icon [which was attached with matMenuTriggerFor as shown in above code] 如下图所示,即使初始菜单项弹出窗口正确显示,在我滚动页面时,弹出元素也不再附加到上面的汉堡包图标[如上面的代码所示,它附加在matMenuTriggerFor上]

在此处输入图片说明

Issue will be fixed in the next version. 问题将在下一版本中修复。 For now you can do workaround in .mat-menu-panel set position: fixed!important; 现在,您可以在.mat-menu-panel设置位置中解决此问题:fixed!important;

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM