保持菜单打开角度 [英] keep mat-menu open angular
问题描述
我正在尝试使用菜单中的复选框选项,但是我需要保持菜单打开,直到用户完成选择选项为止.我正在使用最新版本的Angular.预先谢谢你!
I am trying to use checkbox options in a menu, but I need to keep the menu open until the user is finished selecting options. I am using the latest version of Angular. Thank you in advance!
我将此处中的嵌套菜单与复选框合并在一起:
I have combined the nested mat-menu from here with checkboxes:
我尝试过的操作,但是在选中复选框后菜单关闭:
<mat-menu #worldtest="matMenu" md-prevent-menu-close="md-prevent-menu-close">
<section><mat-checkbox class="example-margin" [(ngModel)]="checked">Checked</mat-checkbox></section>
<section><mat-checkbox class="example-margin" [(ngModel)]="indeterminate">Indeterminate</mat-checkbox></section>
</mat-menu>
推荐答案
当您在mat-menu菜单上使用复选框(或任何响应点击的交互式元素)时,您不希望菜单在您关闭时关闭单击它,您需要通过使用MouseEvent.stopPropagation()
停止菜单来阻止菜单接收到click事件.尝试这样的事情:
When you use a checkbox (or any interactive element that responds to clicks) on a mat-menu, and you don't want the menu to close when you click it, you need to prevent the menu from receiving the click event by stopping it with MouseEvent.stopPropagation()
. Try something like this:
<mat-checkbox (click)="$event.stopPropagation()">Check Me</mat-checkbox>
md-prevent-menu-close
功能来自AngularJS的旧Angular Material-Angular Material(v6)的最新版本"没有该功能. Angular Material(对于AngularJS为v1.x)和Angular Material2(对于Angular为v2/5/6)不可互换.
The md-prevent-menu-close
feature is from the old Angular Material for AngularJS - the 'latest version' of Angular Material (v6) doesn't have that feature. Angular Material (v1.x for AngularJS) and Angular Material2 (v2/5/6 for Angular) are not interchangeable.
这篇关于保持菜单打开角度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!