Angular - 在调用之前等待刷新会话 API

Angular - Wait for refresh session before call API

我有一个 angular 应用程序使用 AWS Amplify 进行用户管理。在我的主要应用程序组件中,我使用 auth.currentAuthentificatedUser 获取用户数据以使用正确的令牌调用 APIs。但是我的 API 呼叫在 auth.currentAuthentificatedUser 之前完成得很快。我该如何处理?

主要应用组件:

import { Component } from '@angular/core';
import {AwsService} from './aws.service';


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {
  public async 
  title = 'app';
  username = '';
  constructor( public awsService: AwsService) {
    this.awsService.refreshsession(() => {
      this.username=this.awsService.userData.username
      });
  }  
  ngOnInit() {


  }
};

首页组件调用APIs

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})




export class HomeComponent implements OnInit {


  constructor(public dialog: MatDialog, private _data: cotationBase, public router: Router, public awsService: AwsService, public callAPI: callAPI, public snackBar: MatSnackBar) {


  }


  ngOnInit() {

          this.callAPI.getAPI('https://api-dev.cloudyproject.pauset.fr/v0/providers',(response) => {
            console.log(response);
            this.awsImage = '../..'+response.aws.icon;
            this.azureImage = '../..'+response.azure.icon;

            },
            (response) => {
              console.log(response);},
            ) 

  }

在您的 AppComponent 模板中,继续使用 *ngIf 指令。像这样:

<app-component>
    <home-component *ngIf="username">
    </home-component>
</app-component>

这样,在 AppComponent 上设置 this.username 之前,它不会打开 HomeComponent。这有意义吗?

如果这个答案有效,请不要忘记采纳。