隐藏登录组件的标题

Question

我在app.component.中有一个头部组件和主体组件

<app-header></app-header>
<div class="body">
<router-outlet></router-outlet>
</div>

如果我在登录组件中，我想隐藏头元素。我该怎么做？

Answer 1

Demo在这里您可以使用(activate)事件来检测组件的更改。

<app-header *ngIf="isShow"></app-header>
<div class="body">
<router-outlet (activate)="showHideNav($event)"></router-outlet>
</div>

然后在appcomponent.ts中创建一个布尔参数

isShow=false;

和写功能

showHideNav(event){
this.isShow= !(event instanceof LoginComponent);                                        
} 

Answer 2

您可以在应用程序路由级别上定义它，例如如果它的"/login">

app-routing.module.ts

{ path: 'login', loadChildren: './login/login.module#LoginModule' }

login.component.html

<h1>Login Page</h1>

如果其"/someroute">

app-routing.module.ts

{ path: 'someroute', loadChildren: './someroute/someroute.module#SomeRouteModule'}

someroute.component.html

<app-header></app-header>
<div class="body">
<router-outlet></router-outlet>
</div>