Как вызвать функцию только после завершения выполнения потока в angular 5?

Question

Я пытаюсь вызвать функцию после потока.Но функция вызывается до завершения потока.Где мне нужно поменять?

this._listService.getListById(this.userName)
  .subscribe((response: any) => {     // getting proper response.
    if (response) {
      this._listServiceMod.loadListModel(response); // thread
      this.filterList();
    }
  });



 loadListModel(data:any) {
        const promise = this._listItemService.run(
                        this.loadListItem,
                        {
                            constants: appConstants
                        });
        promise.then((updatedAuthList) => {
            ....
            ....
            this._listItemService.terminate(promise);
        }).catch(e => {
        });;
    }




  filterList(){
  console.log('Inside Filter List')  // prints before completing thread.
  }

Answer 1

изменить loadListModel на Observable:

this._listServiceMod.loadListModel(response).pipe(
  tap(() =>  this.filterList())
).subscribe()

Answer 2

Если filterList не зависит от вывода предыдущих методов, вы можете использовать RxJs mergeMap для обработки этой ситуации.

this._listService.getListById(this.userName).pipe(
  mergeMap(response => this._listServiceMod.loadListModel(response))
).subscribe(response => {
  this.filterList();
});

Answer 3

Измените свой метод loadListModel на следующий.

loadListModel(data:any): Promise<any> {
   let promise = this._listItemService.run(
       this.loadListItem,
       {
          constants: appConstants
       })
   return promise.then((updatedAuthList)=> {
       this._listItemService.terminate(promise);
       return true;
   });
}

Теперь вы можете преобразовать возвращенное обещание в наблюдаемое и использовать mergeMap в rxjs для объединения двух наблюдаемых

this._listService.getListById(this.userName)
 .pipe(
    mergeMap(response => {
      if(response) {
        // Getting the promise
        let promise = this._listServiceMod.loadListModel(response);

        // Converting the promise to an observable by using rxjs's from
        return from(promise);
      } else {
        return false;
      }
    )
 )
 .subscribe((res) => {
    // Finally call the filterList
    if(res)
       this.filterList();
 });

Оформить заказ stackblitz

Answer 4

Попробуйте использовать этот способ, используя async

this._listService.getListById(this.userName)
.subscribe((response: any) => {    
  if (response) {
     this.modelOpen(response);
  }
});

filterList(){
  console.log('Inside Filter List')
}

async modelOpen(response) {
   await this._listServiceMod.loadListModel(response);
   this.filterList();
}

Async