角路由父级和子级有效

时间:2019-05-31 06:42:20

标签: angular routing

我遇到的情况是,如单击父菜单项“ technicalSettings”,它将打开空白视图和子菜单。

我正在寻找,当使用单击父菜单项时,视图不应更改。仅当单击子菜单项时,它才应该更改。

角度

const routes: Routes = [
      { path: 'dashboard', component: DashboardComponent },
      { path: 'technicalSettings',
        children: [
          { path: '', redirectTo: '', pathMatch: 'prefix' },
          {
              path:'disciplines',
              component: DisciplinesComponent
          },
          {
              path:'disciplines/:disciplineId',
              component: DisciplinesComponent
          }
      ] },
      { path: '', redirectTo: 'dashboard', pathMatch: 'full' }
    ];

HTML

<div class="level-1" [ngClass]="openMenu ? 'expand-menu' : ''">

     <ul>
       <li><a href="javascript:void(0);"  routerLink="dashboard" routerLinkActive="active" (click)="openSubMenu(false, false, 'Dashboard')"><i class="fa fa-dashboard " aria-hidden="true"></i><span>Dashboard</span><i class="fa fa-angle-right"></i></a></li>
       <li><a href="javascript:void(0);"><i class="fa fa-database" aria-hidden="true" (click)="openSubMenu(false, false, 'Data')"></i><span>Data</span><i class="fa fa-angle-right"></i></a></li>
       <li><a href="javascript:void(0);"><i class="cis2-fa cis2-fa-mercedes" aria-hidden="true" (click)="openSubMenu(false, false, 'Vehicles')"></i><span>Vehicles</span><i class="fa fa-angle-right"></i></a></li>
       <li><a href="javascript:void(0);"><i class="fa fa-star" aria-hidden="true" (click)="openSubMenu(false, false, 'Favorites')"></i><span>Favorites</span><i class="fa fa-angle-right"></i></a></li>
       <li><a href="javascript:void(0);"><i class="fa fa-users" aria-hidden="true" (click)="openSubMenu(false, false, 'User Accounts')"></i><span>User Accounts</span><i class="fa fa-angle-right"></i></a></li>
       <li><a href="javascript:void(0);"  routerLink=""  routerLinkActive="active" (click)="openSubMenu(true, false,'Technical Settings')"><i class="fa fa-cog" aria-hidden="true" ></i><span>Technical Settings</span><i class="fa fa-angle-right"></i></a></li>
       <li><a href="javascript:void(0);"><i class="fa fa-cogs" aria-hidden="true" (click)="openSubMenu(false, false, 'System Settings')"></i><span>System Settings</span><i class="fa fa-angle-right"></i></a></li>
       <li><a href="javascript:void(0);"><i class="fa fa-road" aria-hidden="true" (click)="openSubMenu(false, false, 'Projects')"></i><span>Projects</span><i class="fa fa-angle-right"></i></a></li>
     </ul>
  </div>

  <div class="level-2" [ngClass]="openSubNav ? 'sub-menu' : ''">

    <ul *ngIf="vData">
        <li><a href="javascript:void(0);"  routerLink="/technicalSettings/disciplines" routerLinkActive="active" (click)="openSubMenu(true, true, 'Disciplines')">Value Management <i class="fa fa-angle-right"></i></a></li>
        <li><a href="javascript:void(0);"  routerLink="" routerLinkActive="active" (click)="openSubMenu(true, true, 'Parameters')">Excel Import <i class="fa fa-angle-right"></i></a></li>
        <li><a href="javascript:void(0);"  routerLink="" routerLinkActive="active" (click)="openSubMenu(true, true, 'Technical')">Generate Documents<i class="fa fa-angle-right"></i></a></li>
    </ul>

0 个答案:

没有答案