Angular Router嵌套命名出口

时间:2017-02-01 19:02:21

标签: angularjs angular angular-routing

我使用Angular(v2.4.5)。是否可以使用嵌套的命名出口?

以下是我的情况:

//app.component.html
<router-outlet name="test"></router-outlet>
<router-outlet></router-outlet>

//dashboard.component.html
<router-outlet name="test"></router-outlet>
<router-outlet></router-outlet>

路线:

    const routes: Routes = [
      {
        path: '',
        redirectTo: '/dashboard',
        pathMatch: 'full'
      },
      {
        path: 'login',
        component: LoginComponent
      },
      {
        path: 'dashboard',
        component: DashboardComponent,
        canActivate: [AuthGuard],
        children: [
          {
            path: '',
            redirectTo: 'inbox',
            pathMatch: 'full'
          },
          {
            path: 'inbox',
            component: InboxContentComponent
          },
          {
            path: 'test',
            component: TestComponent,
            outlet: 'test'
          }
       ],
       {
            path: 'test',
            component: TestComponent,
            outlet: 'test'
       }
    }

如果我转到此网址:http://localhost/login(test:test),TestComponent将加载到app.component.html插座中。 如果我转到此网址:http://localhost/dashboard/inbox(test:test),TestComponent将加载到app.component.html出口而不是dashboard.component.html

我希望能够从信息中心定位测试插座。有可能吗?

0 个答案:

没有答案