Angularjs 4 - 需要刷新显示/隐藏指令

Question

我有一个问题隐藏导航栏，当用户没有登录（在公共视图），我检查currentUser项目是否存在localStorage然后我使用 * ng如果在html模板上显示/隐藏。

当我首先登录时，我看不到导航栏，但刷新页面后显示，同样当我注销时，首先它显示它，刷新页面后，它已经消失。

还有就是我app.component.ts

import { Component, OnInit } from '@angular/core'; 

@Component({ 
    moduleId: module.id, 
    selector: 'app', 
    templateUrl: 'app.component.html' 
}) 

export class AppComponent implements OnInit { 

    userLogged = JSON.parse(localStorage.getItem('currentUser')); 

    ngOnInit() { 
     console.log(this.userLogged); 

    } 

} 

而且我app.component.html

<!-- main app container --> 
<div class="jumbotron"> 
    <div class="container"> 
     <ng-navbar *ngIf="userLogged"></ng-navbar> 
     <div class="col-sm-12"> 
      <alert></alert> 
      <router-outlet></router-outlet> 
     </div> 
    </div> 
</div> 

如果您需要了解更多信息自讨苦吃，是我第一次Angularjs 4的问题，我不知道该怎么精确显示。

Answer 1

试试这个：

<ng-navbar *ngIf="userLogged()"></ng-navbar> 

userLogged() { return JSON.parse(localStorage.getItem('currentUser')) };