Question

我正在尝试使用在其路由配置文件中声明的子路由来延迟加载模块，懒惰模块已成功加载，但我无法导航到它的子路由。

我正在使用该技术，好像它是一个急切加载的模块。我宣布道路，里面是孩子们。请参阅Plunker中的'moduleB'路由文件链接按钮正在尝试导航到子路由并加载CmpC。但它失败了。

这是我的根模块路由decalration：

{ path: 'feature-b', loadChildren:'src/featureB/featureB.module#FeatureBModule' ,  pathMatch: 'full'}

这是我的延迟加载模块路由声明。

export const moduleBRoutes: Routes = [

  { path: '', component:CmpC , pathMatch: 'full',children:[
      {path: '' , pathMatch: 'full'},
      { path: 'c', component:CmpB , pathMatch: 'full'}
  ]},

];

export const subRouting: ModuleWithProviders = RouterModule.forChild(moduleBRoutes);

尝试导航到：localhost：999 / feature-b成功

尝试导航到：localhost：999 / feature-b / c失败

https://plnkr.co/edit/wFlJoDXRmAlMOswmwWFk?p=preview

Answer 1

工作演示： https://plnkr.co/edit/xAGjXqpmkLbCokvCt9qQ?p=info

删除了不必要的

用法

pathMatch:'full'

不要无缘无故地在任何地方使用它。

它现在按预期工作。

详细了解pathMatch https://angular.io/docs/ts/latest/guide/router.html#!#redirect，https://angular.io/docs/ts/latest/api/router/index/Routes-type-alias.html

Answer 2

我有同样的问题，在我的情况下没有出现错误，但视图没有加载，我可以通过这种方式解决问题：

这是我的懒人模块

const routes: Routes = [
  {
    path: 'admin', loadChildren: 'app/admin/admin.module#AdminModule'
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes, { enableTracing: !environment.production })],
  exports: [RouterModule]
})
export class AppRoutingModule { }

这是我的根模块

R.id

现在路线：

管理员/
管理员/用户
管理员/游戏

完美运作

如何导航到延迟加载的模块子路由？

2 个答案: