@akveo/nga-theme/components/menu/menu-item.component.html

@akveo/nga-theme

<span *ngIf="menuItem.group" class="menu-group">
  <i class="{{ menuItem.icon }}" *ngIf="menuItem.icon"></i>
  {{ menuItem.title }}
</span>
<a *ngIf="menuItem.link && !menuItem.url && !menuItem.children && !menuItem.group"
        [class.active]="menuItem.selected"
        [routerLink]="menuItem.link"
        [attr.target]="menuItem.target"
        [attr.title]="menuItem.title"
        (mouseenter)="onHoverItem(menuItem)"
        (click)="onSelectItem(menuItem)">
  <i class="{{ menuItem.icon }}" *ngIf="menuItem.icon"></i>
  <span>{{ menuItem.title }}</span>
</a>
<a *ngIf="menuItem.url && !menuItem.children && !menuItem.link && !menuItem.group"
        [class.active]="menuItem.selected"
        [attr.href]="menuItem.url"
        [attr.target]="menuItem.target"
        [attr.title]="menuItem.title"
        (mouseenter)="onHoverItem(menuItem)"
        (click)="onSelectItem(menuItem)">
  <i class="{{ menuItem.icon }}" *ngIf="menuItem.icon"></i>
  <span>{{ menuItem.title }}</span>
</a>
<a *ngIf="!menuItem.children && !menuItem.link && !menuItem.url && !menuItem.group"
   [class.active]="menuItem.selected"
   [attr.target]="menuItem.target"
   [attr.title]="menuItem.title"
   (mouseenter)="onHoverItem(menuItem)"
   (click)="$event.preventDefault();onItemClick(menuItem)">
  <i class="{{ menuItem.icon }}" *ngIf="menuItem.icon"></i>
  <span>{{ menuItem.title }}</span>
</a>
<a *ngIf="menuItem.children"
   [class.active]="menuItem.selected"
   (click)="$event.preventDefault();onToggleSubMenu(menuItem)"
   [attr.target]="menuItem.target"
   [attr.title]="menuItem.title"
   (mouseenter)="onHoverItem(menuItem)"
   href="#">
  <i class="{{ menuItem.icon }}" *ngIf="menuItem.icon"></i>
  <span>{{ menuItem.title }}</span>
  <i class="ion" [class.ion-chevron-right]="!menuItem.expanded"
                 [class.ion-chevron-up]="menuItem.expanded"></i>
</a>
<ul *ngIf="menuItem.children"
    [class.menu-collapsed]="!(menuItem.children && menuItem.expanded)"
    [class.menu-expanded]="menuItem.expanded">
  <li ngaMenuItem *ngFor="let item of menuItem.children"
                  [menuItem]="item"
                  [class.expanded]="item.expanded"
                  [class.collapsed]="!item.expanded"
                  (hoverItem)="onHoverItem($event)"
                  (toggleSubMenu)="onToggleSubMenu($event)"
                  (selectItem)="onSelectItem($event)"
                  (itemClick)="onItemClick($event)"></li>
</ul>