首页 > 解决方案 > 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?

标签: angularangular6

解决方案


的值nanVisible在您的 AppComponent 加载时设置 ( ngOnInit),仅在您启动应用程序时设置一次。

您可以通过在路由更改时更新它来解决它:

constructor(private router: Router) {
   router.events.subscribe((event) => {
      if (event instanceof NavigationEnd) {
        this.navVisible = this.authsrv.showNav();
      }
    });
}

我想您想要做的是将当前路线发送到您的showNav方法。


推荐阅读