Angular6:延迟加载时引导模块组件

时间:2018-09-30 19:01:13

标签: angular

说明

我有一个辅助模块,它为内部模块提供了共享的逻辑/视图(为简单起见,在此示例中添加了页脚)。

结构如下:

  • app.module
    • container.module
      • inner1.module
      • inner2.module

app.routing中,模块app延迟加载到container模块中,如下所示:

  {
    path: 'inner1',
    loadChildren: 'app/container/container.module#ContainerModule'
  },
  {
    path: 'inner2',
    loadChildren: 'app/container/container.module#ContainerModule'
  },

container.routing.ts选择正确的组件时:

  {
    path: 'inner1',
    component: Inner1Component,
  },
  {
    path: 'inner2',
    component: Inner2Component,
  }

container.module会引导其自身的组件:

  bootstrap: [
    ContainerComponent
  ]

container.component.html有一个router-outlet和一个页脚的地方:

<router-outlet></router-outlet>
<footer>
   // Stuff here
</footer>

现在 问题

当路线为inner1时,container.component从未真正激活,并且页脚也从未显示。似乎router-outlet的{​​{1}}直接显示了app.component.html的内容。

客观

inner1.component.html路由器在其插座中显示app.module的内容,container.component路由器在container.module的插座中显示inner1.component

如何实现?

0 个答案:

没有答案