angular2中如何通过router设置特色模块默认登陆组件

Question

我有两个模块（clientModule、AdminModule），管理模块是延迟加载的。

在页面加载时，加载客户端模块。

客户端模块路由

const _routes: Routes = [
  {
    path: ':id', component: appComponent, children: [
      { path: 'page1', component: page1Component},
      { path: 'admin', loadChildren:  './admin/admin.module#AdminModule' }
    ]
  }
];

管理模块路由

const _routes: Routes = [
  {
    path: '', component: AdminComponent, children: [
      { path: 'adminPage1', component: adminPage1Component},
      { path: 'adminPage2', component: adminPage2Component},

    ]
  }

];

问题

要求是在管理模块加载时导航到 'adminPage1Component' 组件。

Answer 1

我已经解决了，如果有人遇到同样的问题，下面的方法行得通。

管理模块路由配置

const _routes: Routes = [
  {
    path: '', component: AdminComponent, children: [
      { path: ' ', component: adminPage1Component},
      { path: 'adminPage1', component: adminPage1Component},
      { path: 'adminPage2', component: adminPage2Component},

    ]
  }
];

通过在 children 数组中添加一个空路径 ( { path: ' ', component: adminPage1Component} ) 默认加载组件。

此外，如果您有需要在加载组件时添加 css class 的元素。例如：

 <li routerLink="adminPage1" routerLinkActive="active">
          Admin Page 1
 </li>

您可以执行以下操作来支持 routerLinkActive

const _routes: Routes = [
  {
    path: '', component: AdminComponent, children: [
      { path: ' ', component: adminPage1Component, redirectTo: 'adminPage1',  pathMatch: 'full'},
      { path: 'adminPage1', component: adminPage1Component},
      { path: 'adminPage2', component: adminPage2Component},

    ]
  }
];

我基本上是把“redirectTo: 'adminPage1', pathMatch: 'full'”添加到空路径中。

angular2中如何通过router设置特色模块默认登陆组件

How to set featured module default landing component via router in angular 2

angular

router-outlet