javascript - Angular 6: async await een variabele kreeg het variabele

Onder mijn Angular 6-app heb ik een variabele "permittedPefs" die waarde krijgt na een HTTP-aanroep (asynchroon)

 @Injectable()
 export class FeaturesLoadPermissionsService {
    permittedPefs = [];
    constructor() {       
       this.loadUserPefsService.getUserRolePefs(roleId)
                               .subscribe(
              (returnedListPefs) => {
                this.permittedPefs = returnedListPefs;
              },
              error => {
                console.log(error);
              });
    }
}

In een andere methode gebruik ik diezelfde variabele: permittedPefs

Maar aangezien het aanvankelijk leeg is en het zijn waarde pas na enige tijd krijgt, moet ik dus wachten om het opnieuw te gebruiken.

Ik heb geprobeerd async-await te gebruiken, en mijn doel is te wachten tot permittedPefs een objectwaarde krijgt

  async checkPefPresence(pefId) {
    const listPefs = await this.permittedPefs
  }

hoe los je het op ??

Antwoord #1

Aangezien de methode loadUserPefsService.getUserRolePefs een Observable retourneert, kun je deze opslaan en er later op abonneren wanneer je het nodig hebt.

 @Injectable()
 export class FeaturesLoadPermissionsService {
     permittedPefs = [];
     constructor() {
         this.userRolePefsObservable = this.loadUserPefsService.getUserRolePefs(roleId);
     }
 }

 checkPefPresence(pefId) {
     let listPefs;
     this.userRolePefsObservable.subscribe(
         (returnedListPefs) => {
             listPefs = returnedListPefs;
         },
         error => {
             console.log(error);
         });
 }

Antwoord #2

Gebruik een behaviorSubject

  @Injectable()
    export class FeaturesLoadPermissionsService {

      permittedPefs: BehaviorSubject<any[]> = new BehaviorSubject([]);

      constructor() {
        this.loadUserPefsService.getUserRolePefs(roleId)
          .subscribe((returnedListPefs) => {
            this.permittedPefs.next(returnedListPefs);
          },
            error => {
              console.log(error);
            });
      }
    }

Dan, waar je het ook aan het controleren bent (vergeet niet je af te melden wanneer je klaar bent)

als het asynchroon moet zijn, kun je het als hieronder doen

  async checkPefPresence(pefId): Promise {
    return new Promise((resolve, reject) => {
      this.featuresLoadPermissionsService.permittedPefs.subscribe(listPefs  => {
          //handle whatever check you want to do here 
          resolve();
      },reject);
    })