javascript - Angular 2 : How to propagate HTML elements with router?

Question

有一个基本的 DOM:

main
- child A        :goBack()
  -- subChild A  :*
- child B        :goBack()

从 app.component.html 中，我将 footer 元素传播到所有 DOM 子元素。我想知道的是，为什么子A页面上没有出现返回按钮？

参见stackblitz .

Answer 1

您必须创建子子路由作为实际的子路由。否则它将被像任何其他路由一样处理并完全替换 <router-outlet>标签，在本例中为 ChildComponent .

const routes: Routes = [
  { path: '', component: MainComponent },
  {
    path: ':child', component: ChildComponent, children: [
      { path: 'subChildA', component: SubChildComponent }
    ]
  },
];

此外，您还需要第二个<router-outlet> ChildComponent 模板中的标签子路线(子子路线)应该被渲染的地方。

看看修改后的stackblitz .