时间戳

首页 > 解决方案 > Angular 2 Typescript 在登录/注销时重新加载组件

angular - Angular 2 Typescript 在登录/注销时重新加载组件

问题描述

目前，如果我以管理员身份登录，我的导航组件上有一个管理部分。如果我注销并使用非管理员用户登录，管理员部分仍然在我的侧导航中可见）。如果我进行硬刷新 or Location.reload()，它就会消失。我宁愿在不刷新页面的情况下重新加载侧导航组件。login()除了andlogout()函数所在的组件之外，如何重新加载组件？


topnav.component.ts

@Component({
  selector: "app-top-nav"
  //...
})

//...
login() {
    //do login stuff
  },
  error => {
    //do error stuff
  },
  () => {
    this.router.navigate(["/dashboard"]);
  });
}

logout() {
  //do logout stuff...
  this.router.navigate(["/home"]);
}


topnav.component.html

<form *ngIf="!loggedIn()" #loginForm="ngForm" class="navbar-form navbar-right" (ngSubmit)="login()">
  //login form
</form>

<a (click)="logout()"><i class="fa fa-sign-out"></i> Logout</a> //only present when logged in


sidenav.component.ts

@Component({
  selector: "app-side-nav"
  //...
})

export class SideNavComponent implements OnInit {
  //...
}


sidenav.component.html

//...
<ul class='nav navbar-nav' *ngIf="user.userRoleId == UserRoles.Admin">

标签： angulartypescript

解决方案

我不知道你的uservar 是什么样子，如果它是组件绑定的，那就是你的问题。您希望将其移至服务并在登录时对其进行更新/设置。

推荐阅读