javascript - Angular 2:如何使用路由器传播HTML元素？

有一个基本的DOM：

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

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

请参见stackblitz。

最佳答案

您必须将子代创建为实际的子代路线。否则，它将像其他路线一样处理，并完全替换<router-outlet>标记（在本例中为ChildComponent）。

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

此外，您还需要在<router-outlet>模板中的第二个ChildComponent标记，应该在该模板中呈现子路由（子孩子）。

看看修改后的stackblitz。