在指定路线上隐藏头部-角6
在指定路线上隐藏头部-角6
提问于 2018-09-24 14:23:06
我只是想把头像藏起来，只有一条路。
假设我有三条路线，route1，route2和route3。
我有一个组件叫做app-header。
我希望在用户进入app-header时隐藏组件route1，并在其他2条路由中显示该组件。
我在这里找到了一些关于堆栈溢出的话题，但是它们都没有帮助我
你们能帮个忙吗？
这是我的密码：
- app.component.ts 导出类AppComponent实现OnInit { showHeader = true；构造函数(私有路由器:路由器){this.router.events.subscribe(事件=> this.modifyHeader(事件))；} ngOnInit() {}modifyHeader(位置){ //此方法被称为多次console.log(location.url)；//如果(location.url ===‘/route1 1’){ this.showHeader = false；} this.showHeader = true；}
- **app.component.html**“
我用的是角6.1.4
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-09-24 14:42:01
由于您知道要检测哪一条路由，并且在应用程序组件中似乎有一个解决方案，所以我建议过滤路由器事件，如下所示：
export class AppComponent implements OnInit {
showHeader = true;
constructor(
private router: Router
) {
this.router.events.pipe(
filter(e => e instanceOf NavigationEnd)
).subscribe(event => this.modifyHeader(event));
}
ngOnInit() {
}
modifyHeader(location) { // This method is called many times
console.log(location.url); // This prints a loot of routes on console
if (location.url === '/route1') {
this.showHeader = false;
} else {
this.showHeader = true;
}
}
}Stack Overflow用户
发布于 2018-09-24 14:44:43
在路由器插座上添加功能
<router-outlet (activate)="modifyHeader()"></router-outlet>在构造函数中
router;
constructor(private _router: Router ) {
this.router = _router;
}你的modifyHeader函数
modifyHeader() { // This method is called many times
console.log(this.router.ur); // This prints a loot of routes on console
if (this.router.ur === '/route1') {
this.showHeader = false;
} else {
this.showHeader = true;
}
}如果你面临任何问题请告诉我。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52481465
复制相关文章
相似问题
腾讯云开发者
