Angular 2 Dynamic Page Header and Footer

微笑、不失礼 提交于 2019-12-06 07:59:38

问题


The following is what is included in my app.component.html

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

However my login and register pages are both rendered through this module and they only require the router-outlet. How an dynamically not include the lmenu, header, and footer selectors for the login and register views? Thanks in advance.


回答1:


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

Just switching isLogin between true and false shows/hides the components




回答2:


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


来源:https://stackoverflow.com/questions/42492687/angular-2-dynamic-page-header-and-footer

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!