angular 4 中发生子路由时删除父组件

Question

我正在我的应用程序中开发一条子路线，如下所示。

即使在发生子路由时，此常量部分也应始终存在。我在这里制作的代码示例。当我点击一个页面时，常量部分被删除。我如何始终可用，我需要相同的文件夹结构。我不想移动 <app-constant></app-constant> 应用 html 文件。

https://stackblitz.com/edit/angular-4-childrouting-issue?file=index.html

Answer 1

你在这里创建了三个同级路由，所以实际上没有子路由。您的 forChild(routes) 只是从其他模块导入路由的一种方式。

这就是您创建子路由的方式

  { path: ''      ,
    component:  DefaultComponent,
    children: [
       { path: 'page1', component: Page1Component},
       { path: 'page2', component: Page2Component}
    ]
  },

您当前的路由器插座适合父级别，您需要在 DefaultComponent

中添加第二个路由器插座

<app-constant></app-constant>
<router-outlet></router-outlet>
<app-landing></app-landing>

angular 4 中发生子路由时删除父组件

Parent component removed when child routing happens in angular 4

angular

angular-router