Question

我正在尝试创建动态菜单并将其从它路由到我的组件，但是在子菜单中它具有错误的路由。在我的菜单组件和子菜单下面，效果很好。

   <ul class="sidebar-menu">
      <li class="dropdown" *ngFor="let item of navItems; let i = index;" >

        <a *ngIf="!item.children || item.children.length === 0" [routerLink]="item.route"
           class="nav-link"><i
          [class]="item.iconName"></i><span>{{item.displayName}}</span></a>

        <a *ngIf="item.children && item.children.length > 0"  class="nav-link has-dropdown" ><i
          [class]="item.iconName"></i><span>{{item.displayName}}</span></a>
          <ul menu-item #menu [items]="item.children" [perviouceURL]="item.route" class="dropdown-menu"></ul>

      </li>
    </ul>

在这里我加载子菜单

<li *ngFor="let child of items">
  <a *ngIf="!child.children || child.children.length === 0" [routerLink]="child.route" class="nav-link">
    {{child.displayName}}</a>

  <span *ngIf="child.children && child.children.length > 0">
       <a href="javascript:void(0)" class="nav-link has-dropdown"><i
         [class]="child.iconName"></i><span>{{child.displayName}}</span></a>
        <ul menu-item #menu [items]="child.children" class="dropdown-menu"></ul>
    </span>
</li>

在菜单上单击可正确路由，但在子菜单上可路由错误例如，如果没有子菜单路由，则应为页面/仪表板如果仪表板具有子菜单，则应为页面/仪表板/子菜单但在我的页面路线下方却没有仪表板

  {
    path: 'pages',
    component: PagesComponent,
    children: [
      {path: 'dashboard', loadChildren: './dashboard/dashboard.module#DashboardModule'},
      {path: 'other', loadChildren: './other/other.module#OtherComponentModule'},
      {path: 'newother', loadChildren: './newother/newother.module#NewOtherModule'},
      {path: '', redirectTo: 'dashboard', pathMatch: 'full'},
    ],
  }];

这是我的仪表板子菜单溃败

export const routes: Routes = [
  {
    path: '',
    component: DashboardComponent,
    children: [
      { path: 'generaldashboard', loadChildren:'./generalDashBoard/generalDashBoard.module#GeneralDashBoardModule'},
      { path: 'ecomerce',  loadChildren:'./Ecomerce/Ecomerce.module#EcomerceModule'},
      {path: '', redirectTo: 'generaldashboard', pathMatch: 'full'},
    ]
  }
];

在没有添加路由器链接的情况下保持正确动态的最佳做法是什么，例如[routerLink] =“ pages / item.route”

使用Angular 7进行动态菜单路由

0 个答案: