Angular 2动态页面页眉和页脚

时间:2017-02-27 18:01:42

标签: angular angular2-routing angular2-template

以下是我的app.component.html

中包含的内容

<lmenu></lmenu> <header></header> <router-outlet></router-outlet> <footer></footer>

但是我的登录页面和注册页面都是通过这个模块呈现的,它们只需要路由器插座。如何动态地不包含登录和注册视图的lmenu,页眉和页脚选择器?提前谢谢。

2 个答案:

答案 0 :(得分:4)

<lmenu *ngIf="isLogin"></lmenu>
<header *ngIf="isLogin"></header>
<router-outlet></router-outlet>
<footer *ngIf="isLogin"></footer>

只需在isLogintrue之间切换false即可显示/隐藏组件

答案 1 :(得分:1)

you could use two times in the terminal: 
- ng generate component header
- ng generate component footer

then, in the main app file HTML (app.component.html) you must include the 2 tags: 
<app-header></app-header>
<app-footer></app-footer>

this is the first thing to do.

Then you must populate your templates:
- header.component.html and the styling in header.component.css
- footer.component.html and the styling in footer.component.css