首页 > 解决方案 > 侧边栏项目未在 Angular 2 的侧边栏菜单中突出显示

问题描述

我的侧边栏菜单项有多个菜单项,也有下拉项列表。它在 2 个菜单项上突出显示,但并非全部。这是我的 bamenuitem.html 代码:

    <li *ngIf="!menuItem.hidden" [title]="menuItem.title" [ngClass]="{'al-sidebar-list-item': !child, 
'ba-sidebar-sublist-item': child, 'selected': menuItem.selected && !menuItem.expanded, 
'with-sub-menu': menuItem.children, 'ba-sidebar-item-expanded': menuItem.expanded}">

  <a *ngIf="!menuItem.children && !menuItem.url" (mouseenter)="onHoverItem($event, item)" [routerLink]="menuItem.route.paths" class="al-sidebar-list-link">
    <i *ngIf="menuItem.icon" class="{{ menuItem.icon }}"></i><span>{{ menuItem.title }}</span>
  </a>

  <a *ngIf="!menuItem.children && menuItem.url" (mouseenter)="onHoverItem($event, item)" [href]="menuItem.url" [target]="menuItem.target" class="al-sidebar-list-link">
    <i *ngIf="menuItem.icon" class="{{ menuItem.icon }}"></i><span>{{ menuItem.title }}</span>
  </a>

  <a *ngIf="menuItem.children" (mouseenter)="onHoverItem($event, item)" href (click)="onToggleSubMenu($event, menuItem)" class="al-sidebar-list-link">
    <i *ngIf="menuItem.icon" class="{{ menuItem.icon }}"></i><span>{{ menuItem.title }}</span>
    <b class="fa fa-angle-down" [ngClass]="{'fa-angle-up': menuItem.expanded}"></b>
  </a>

  <ul *ngIf="menuItem.children" class="al-sidebar-sublist" [ngClass]="{'slide-right': menuItem.slideRight}">
    <ba-menu-item [menuItem]="subItem"
                  [child]="true"
                  (itemHover)="onHoverItem($event)"
                  (toggleSubMenu)="onToggleSubMenu($event, subItem)"
                  *ngFor="let subItem of menuItem.children"></ba-menu-item>
  </ul>

</li>

还有我的 bamenuitem.component.ts 在此处输入图像描述

我正在使用 angular 2 并且仪表板侧边栏没有正确突出显示,如果我的 http://localhost:3000/woo/profile/billing 嵌套在 woo/profile/ 中,可能会导致它。

如果我的网址类似于 http://localhost:3000/woo/dashboard,它就可以工作。

如果有人有想法,请帮助我。

标签: angularmenuitemsidebar

解决方案


推荐阅读