My label variable:
Code: Select all
this.model = [
{id: "1", label: 'Validar créditos', icon: 'pi pi-check-square', routerLink: ["/"+URL.reviews], visible: this.canAccessValidacion},
{id: "2", label: 'Procesar créditos', icon: 'pi pi-cog', routerLink: ["/"+URL.cargar], visible: this.canAccessCarga},
{id: "3", label: 'Configurar plantillas', icon: 'pi pi-file', routerLink: ["/"+URL.plantilla], visible: this.canAccessPlantillas},
{id: "4", label: 'Reportes', icon: 'pi pi-book', visible: this.canAccessPlantillas, items: [
{id:"5", label: 'Reporte de dictamen', icon: 'pi pi-copy', routerLink: ["/"+URL.reporteDictamen], visible: this.canAccessPlantillas}
]}
];
Code: Select all
<div class="layout-menu-container" (click)="appMain.onSidebarClick($event)">
<div class="layout-menu-wrapper">
<ul class="layout-menu">
<li app-menuitem *ngFor="let item of model; let i = index;"
[item]="item" [index]="i" [root]="true" [mega]="true"></li>
</ul>
</div>
</div>
Code: Select all
<ng-container>
<a (click)="itemClick($event)" (mouseenter)="onMouseEnter()" *ngIf="item.visible"
[routerLink]="item.routerLink" routerLinkActive="active-menuitem-routerlink" pRipple
[routerLinkActiveOptions]="{exact: true}" [attr.target]="item.target" [attr.tabindex]="0">
<i *ngIf="item.icon && item.visible" [ngClass]="item.icon" class="layout-menuitem-icon"></i>
<span class="menuitem-text" *ngIf="item.visible">{{item.label}}</span>
<i class="pi pi-fw pi-angle-down layout-submenu-toggler" *ngIf="item.items"></i>
<span class="menuitem-badge" *ngIf="item.badge && item.visible">{{item.label}}</span>
</a>
</ng-container>
I appreciate your help.