隱藏菜單鏈接是真的還是假的

Question

我有以下打字稿代碼：

import { Component, OnInit } from '@angular/core'; 
import { AuthService } from '../services/auth.service'; 

@Component({ 
    selector: 'app-header', 
    templateUrl: './header.component.html' 
}) 

export class HeaderComponent implements OnInit { 

    constructor(private authService: AuthService) { } 

    ngOnInit() { 

    var isLoggedIn = false; 

    } 

} 

它具有以下HTML模板：

<nav class="navbar navbar-default"> 
<div class="container-fluid"> 
    <div class="navbar-header"> 
     <a class="navbar-brand" [routerLink]="['/']"> 
    Site Name 
    </a> 
    </div> 
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
     <ul class="nav navbar-nav pull-right"> 
      <li routerLinkActive="active"><a [routerLink]="['/login']">Login</a></li> 
      <li routerLinkActive="active"><a [routerLink]="['/sign-up']">Sign Up</a></li> 
      <li routerLinkActive="active" *ngIf="isLoggedIn"><a [routerLink]="['/logout']">Logout</a></li> 
     </ul> 
     <ul class="nav navbar-nav navbar-right"> 
    </ul> 
    </div> 
</div> 

正如你可以看到，如果在最後一個菜單鏈接（註銷）中，我使用*ngIf來顯示用戶是否登錄的鏈接。目前，我將這些值硬編碼爲假，如果我將其更改爲true，則由於某種原因，鏈接仍然保持隱藏狀態。

請注意，我正在學習Angular2。

Answer 1

import { Component, OnInit } from '@angular/core'; 
import { AuthService } from '../services/auth.service'; 

@Component({ 
    selector: 'app-header', 
    templateUrl: './header.component.html' 
}) 

export class HeaderComponent implements OnInit { 

    isLoggedIn = false; 

    constructor(private authService: AuthService) { } 

    ngOnInit() { 



    } 

}