在ngOnInit Angular之前处理异步诺言

时间:2019-02-28 12:31:18

标签: angular asynchronous promise async-await es6-promise

我有一个返回表数据的请求,该表需要像承诺一样等待,直到数据加载完毕。为了将数据加载到表中,我必须使用异步/等待,但这会弄乱所有其他函数/方法。

如何在不对ngOnInit()使用异步/等待的情况下将数据存储在currentList中?还是有其他方法?

async getEducationList(): Promise<any> {
  return this.educationList = await this.applicationClient.getEducations()
  .toPromise()
  .then((res) => {
    this.educationListAll = res;
  });
}

async ngOnInit() {
  await this.getEducationList();
  this.currentList = this.educationListAll;
}

注意-this.applicationClient.getEducations()是可观察的

2 个答案:

答案 0 :(得分:2)

尝试这种方式

async ngOnInit() : Promise<void> {
  this.currentList = await this.applicationClient.getEducations().toPromise();
  this.initTable(data);
}

initTable(data) {
  // Some code to handle the data
}

答案 1 :(得分:0)

通过将API调用包装在一个可观察的容器中,然后将代码从ngOnInit移至另一个函数initTable,解决了该问题。

getEducationList(): Observable<Education[]> {
  return this.applicationClient.getEducations();
}

initTable(data) {
  // Some code to handle the data
}

ngOnInit() {
  this.getEducationList().toPromise().then(data => {
    this.loader = false;
    this.initTable(data);
  });
}