来自 sessionStorage 的令牌在 app.component.html 中为空

Question

我正在尝试使用以下代码

检查 app.component 中是否存在令牌

app.component.html

<div class="container-scroller">
   <div *ngIf="token">
      <app-navbar></app-navbar>
      <div class="container-fluid page-body-wrapper">
         <app-sidebar></app-sidebar>
         <div class="main-panel">
            <div class="content-wrapper">
               <router-outlet></router-outlet>
            </div>
            <app-footer></app-footer>
         </div>
      </div>
   </div>
   <div *ngIf="token==null">
      <app-login></app-login>
   </div>
</div>

app.component.ts

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'star-admin-angular';
  ngOnInit() {
    let token = sessionStorage.getItem('token');
  }
}

当我使用ts文件调试时，令牌不为空。但在 html 文件中，令牌似乎为空，因为即使有令牌，登录页面也始终显示。

Answer 1

因为您没有将 token 声明为 AppComponent class 的成员。它只是 ngOnInit(){} 范围内的一个 let 变量。你应该写：

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'star-admin-angular';
  token? : any = undefined;
  ngOnInit() {
    this.token = sessionStorage.getItem('token');
  }
}

来自 sessionStorage 的令牌在 app.component.html 中为空

Token from sessionStorage is null in app.component.html

typescript

angular8