使用选项卡路由器导航进行延迟加载

Question

在延迟加载模块中使用路由器导航时似乎有问题。如果我删除延迟加载，这很好用。但这是我根据延迟加载模块进行的设置：

在我的 app.template 中，我定义了主路由器插座。

我有以下根应用路由器

export const ROUTES: Routes = [
  {
    path: 'user/:id', loadChildren: './user/profile/profile.module#ProfileModule'
  }
]

当配置文件模块加载到主路由器出口时，它将显示一个带有两个路由选项卡的页面，并且在内部 profile.module 我定义了以下子路由

const ROUTES: Routes = [
    {
        path: '', component: ProfileComponent,
        children: [
            { path: 'subPath1', loadChildren: '../subModule1/subModule1.module#SubModule1Module' },
            { path: 'subPath2', loadChildren: '../subModule2/subModule2.module#SubModule2Module' },
        ]
    }
];

@NgModule({
    imports: [
        RouterModule.forChild(ROUTES),
     ....
    ]
}

里面 profile.template 我有这样定义的路由选项卡

<nav md-tab-nav-bar>
          <a class="tab-label" md-tab-link [routerLink]="'subPath1'" routerLinkActive #rla="routerLinkActive" [active]="rla.isActive">
            Sub path 1
          </a>
          <a class="tab-label" md-tab-link [routerLink]="'subPath2'" routerLinkActive #rla="routerLinkActive" [active]="rla.isActive">
            Sub path 2
          </a>
        </nav>
      <router-outlet></router-outlet>

当我路由例如到 /user/:id/subPath2 我希望 subModule2 被加载到 md-tab-nav-bar 的路由器出口中，但它被加载到主应用程序路由器出口中。这将关闭 profile.component 并仅显示 submodule2 而不是在选项卡中显示它。

知道为什么这不适用于延迟加载模块吗？

Answer 1

在 Angular2 中 RouterModule

forChild creates a module that contains all the directives and the given routes, but does not include the router service.

forRoot creates a module that contains all the directives, the given routes, and the router service itself.

我觉得你用的最多的是forRoot，因为forChild get only child

 RouterModule.forRoot(ROUTES)

使用选项卡路由器导航进行延迟加载

Lazy loading with tab router navigation

angular2-routing

angular-material2

angular