如何有条件地在 mat-menu 中添加 [matMenuTriggerFor] [英] How to conditionally add [matMenuTriggerFor] in mat-menu
本文介绍了如何有条件地在 mat-menu 中添加 [matMenuTriggerFor]的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
很少有 #menu
项没有子子项.但显示箭头表示有一个子菜单.这是错误的.仅当子菜单中有项目时如何添加[matMenuTriggerFor]=subMenu"
.
Few #menu
items has no sub child. But shows the arrow which indicates there is a submenu. Which is wrong.
How to add [matMenuTriggerFor]="subMenu"
only when there are items in subMenu.
<mat-menu #menu="matMenu">
<ng-container *ngFor="let item of menuItem.items; let i=index">
<button class="mat-menu-item" mat-menu-item
[routerLink]="item.routerLink" routerLinkActive="active" [matMenuTriggerFor]="subMenu"> {{item.name}}
</button>
<mat-menu #subMenu="matMenu"> <button class="mat-sub-menu-item"
*ngFor="let subitem of menuItem.items[i].subitems" mat-menu-item> {{ subitem.name }} </button>
</mat-menu>
</ng-container>
</mat-menu>
推荐答案
通过在按钮上添加 *ngIf="menuItem.items[i].subitems" 解决了这个问题
Resolved this issue by adding *ngIf="menuItem.items[i].subitems" to the button
<button class="mat-menu-item" [class.more-menu-item]="menuItem.name=='More'" mat-menu-item [routerLink]="item.routerLink"
routerLinkActive="active" [matMenuTriggerFor]="subMenu"><span class="pm-menu-item">{{item.name}}</span><i class="material-icons pm-menu-icon-right" *ngIf="menuItem.items[i].subitems">keyboard_arrow_right</i>
</button>
这篇关于如何有条件地在 mat-menu 中添加 [matMenuTriggerFor]的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文