angular не может установить значение переменной publi c

Question

Я пытаюсь установить значение localStorage() в моей переменной и использовать эту переменную в функциях, но переменная имеет вид undefined

код

export class DashboardService {

  public token: any;

  constructor(
    private env: EnvService,
    private http: HttpClient,
    private storage: NativeStorage
  ) {
    this.storage.getItem('token').then((token) => {
      this.token = token.access_token;
      console.log('storage token ', token.access_token);  // see screenshot below
    }).catch(error => console.error(error));
  }

  getDashboard() {
    const headers = new HttpHeaders({
      Accept: 'application/json, text/plain',
      'Content-Type': 'application/json',
      Authorization: this.token
    });
    console.log('my token ', this.token);  // see screenshot below
    console.log('my headers ', headers);  // see screenshot below
    return this.http.get(this.env.Dashboard + '/dashboard', {headers})
    .pipe(
      tap(data => {
        console.log(data);
      })
      );
    }
}

Снимок экрана

другая проблема - мой заголовок запроса отправляет в заголовке 2 значения вместо 3 (не уверен, что это из-за того, что токен не определен или нет)

он должен отправить Accept, Content-Type, Authorization, а не только отправлено Accept и Content-Type

Есть идеи?

Обновление

Это мой компонент, который я называю своим сервисом выше

export class DashboardPage implements OnInit {

  schools: any = [];

  constructor(
    private authService: AuthenticationService,
    private menu: MenuController,
    private dashboardService: DashboardService
  ) {
    this.getSchool();
  }

  ngOnInit() {
    this.menu.enable(true);
  }

  logout() {
    this.authService.logout();
  }

  getSchool() {
    this.dashboardService.getDashboard().subscribe((res) => {
        this.schools = res;
    });
  }

}

Answer 1

РЕШЕНО

Я бы изменил оба сервиса и файл компонента, чтобы получить мои данные, вот мой окончательный код

services

getDashboard(): Observable<any> {
    const httpOptions = {
      headers: new HttpHeaders({
        Accept: 'application/json, text/plain',
        'Content-Type': 'application/json',
        Authorization: this.token.access_token
      })
    };
    return this.http.get(`${this.env.Dashboard}` + '/dashboard', httpOptions).pipe(
      map(data => data)
    );
  }

component

async getSchool() {
    this.loading = await this.loadingController.create({
      message: 'Please wait...',
      spinner: 'dots',
      duration: 3000
    });

    await this.loading.present();

    this.dashboardService.getDashboard().subscribe((res) => {
      for (const school of res.data) {
        this.schools.push(school);
      }
      this.hideLoading();
    });
  }

  private hideLoading() {
    this.loading.dismiss();
  }

теперь загрузка моей страницы включает мои данные с соответствующим экраном загрузки.

надеюсь, что это поможет и другим.