angular - show navigation only in inner pages and not on login/registration pages
问题描述
i am trying to show the navigation-bar only in "inner-pages" of the application and not on login/register pages.
I have created a separate component on navigation
, and in app.component.html
I show it
<app-navbar *ngIf="navVisible"></app-navbar>
<div class="container">
<router-outlet></router-outlet>
</div>
I thought that if i'll use *ngIf=navVisible
it will work, but it doesn't.
app.component.ts
ngOnInit(): void {
this.navVisible = this.authsrv.showNav();
}
AuthenticationService.ts
showNav(): boolean {
let path = window.location.pathname;
let page = path.split("/").pop();
if ((page.trim() === "login") || (page.trim() === "registration") || (page.trim() === "")) {
return false;
}
else
return true;
}
But it doesn't work when i am going from the login to the inner pages.
I tried the same but in navbar.component.html & navbar.component.ts
Can someone explain to me what is wrong here?
解决方案
的值nanVisible
在您的 AppComponent 加载时设置 ( ngOnInit
),仅在您启动应用程序时设置一次。
您可以通过在路由更改时更新它来解决它:
constructor(private router: Router) {
router.events.subscribe((event) => {
if (event instanceof NavigationEnd) {
this.navVisible = this.authsrv.showNav();
}
});
}
我想您想要做的是将当前路线发送到您的showNav
方法。
推荐阅读
- javascript - 覆盖 DevExpressReactive Grid 库中的表编辑行以使受控文本字段相互依赖
- angular - 具有 Angular Universal 的 Angular 元素
- azure - 当我运行下一步时,Azure 数据工厂管道不会连接到私有终结点公之于众?
- php - Woocommerce:根据自定义字段从产品中获取产品属性颜色
- css - 如何在悬停时将过渡速度应用于缩放图像?
- python - 多索引列 pandas 的总和
- spring-mvc - 更新列表时如何更新百里香?
- javascript - 如何防止 fs.createReadStream 打开超过 x 个文件?
- raspberry-pi - 有人可以通过树莓派跟踪 vpn
- python - 我已扩展名为 UserProfile 的默认用户表,并希望从产品模型访问信息,但显示完整性错误