想用Ngzorro做一个动态生成的菜单,官方例子都是写死的。
Html字符串拼接出来了,如果直接写在HTML里就有样式,通过innerHtml就没有样式了。
拼接出来的Html代码如下。
<ul nz-menu [nzMode]="'inline'" style="height:auto" >
<li nz-submenu>
<div menuEvent title><span type="laptop">用户管理</span></div>
<ul><li nz-menu-item><div menuEvent><span>用户维护</span>
</div></li></ul></li></ul><ul nz-menu [nzMode]="'inline'" style="height:auto" >
<li nz-submenu><div menuEvent title><span type="laptop">微信管理</span>
</div>
</li>
</ul>
求大神帮忙。
<ul nz-menu nzMode="inline" nzTheme="dark">
<ng-container *ngTemplateOutlet="menuTpl; context: { $implicit: menus }"></ng-container>
<ng-template #menuTpl let-menus>
<ng-container *ngFor="let menu of menus">
<li *ngIf="!menu.items" [nzPaddingLeft]="menu.level * 24" nz-menu-item>
<a routerLink={{menu.routerLink}}> <i nz-icon [nzType]="menu.icon"></i><span>{{menu.desc?menu.desc:menu.label}}</span></a>
</li>
<li *ngIf="menu.items" nz-submenu [nzPaddingLeft]="menu.level * 24" [nzTitle]="menu.desc?menu.desc:menu.label" [nzIcon]="menu.icon"
>
<ul>
<ng-container *ngTemplateOutlet="menuTpl; context: { $implicit: menu.items }"></ng-container>
</ul>
</li>
</ng-container>
</ng-template>
</ul>
meus组装成官网的格式就好啦
可以的 但是这个菜单级(3级菜单,4级菜单) 可以做到动态吗?
@BHongyi: 可以啊,层级取决于你构造的返回值,这个递归显示的