ウェブサイト検索

javascript - Angular 6 : 非同期 await ある変数を取得した変数


私のAngular 6アプリでは、HTTP呼び出し(非同期)後に値を取得している「permittedPefs」という変数があります

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

別の方法では、私は同じ変数permittedPefsを使用しています

しかし、それは最初は空で、しばらくしてから値を取得するので、それを再利用するには待つ必要があります。

私はasync-awaitを使おうとしました。そして私の目的は、permittedPefsがオブジェクトの値を取得するのを待つことです

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

それを直すにはどうすればいいですか??

回答 #1

loadUserPefsService.getUserRolePefs メソッドは Observable を返すので、それを保存しておき、必要なときに後で購読することができます。

 @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);
         });
 }

回答 #2

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);
            });
      }
    }

それから、それを確認している場所ならどこでも(終わったら購読解除することを忘れないでください)

もし非同期である必要があるなら、以下のようにすることができます

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