Angular:如何路由到整个新页面,而不是将其注入<router-outlet> </router-outlet>?

时间:2019-06-06 08:36:26

标签: angular angular-routing

我想创建一个html页面,其标题与大多数页面上的不同。目前,我一直在通过<router-outlet></router-outlet>注入内容,因此页眉和页脚始终相同。我如何使路由器仅查看连接到路由的html组件,而不是将其注入到<router-outlet></router-outlet>地方

1 个答案:

答案 0 :(得分:1)

在您的应用程序component.html中,您应该具有:

<body>
  <app-header></app-header>
  <router-outlet></router-outlet>
  <app-footer></app-footer>
</body>

您显然创建了app-header和app-footer组件。
如果您希望标题中有特殊行为,请在组件内部实现该行为。

如果您的特殊标头完全不同并且不与应用程序标头组件共享任何逻辑,则可以创建一个新的并有条件地显示它,例如:

<body>
  <app-header *ngIf="!condition"></app-header>
  <app-special-header *ngIf="condition"></app-special-header>
  <router-outlet></router-outlet>
  <app-footer></app-footer>
</body>