JavaScript / Angular 1 - Promise.all到async-await

时间:2018-01-18 10:18:51

标签: javascript angularjs async-await ecmascript-2017

我在referencesPromisecontactTypesPromise $onInit()中的两个变量中为Web服务分配了两个调用(如果需要,我可以为此创建一个新方法)

$onInit() {
  const referencesPromise = this.ReferenceService.getMultipleReferences(this.AgentReferences)
  const contactTypesPromise = this.ContactService.getContactTypes()
  Promise.all([referencesPromise, contactTypesPromise]).then((responses) => {
    this.references = responses[0]
    this.contactTypes = responses[1]
    const stateParams = this.$state.params
    return this.setContactSteps()
  })
}

他对async-await的替代方案是什么?

3 个答案:

答案 0 :(得分:1)

假设您仍然希望自己的方法同时运行,则无法进行太多更改:

async $onInit() {
  const referencesPromise = this.ReferenceService.getMultipleReferences(this.AgentReferences);
  const contactTypesPromise = this.ContactService.getContactTypes();

  this.references = await referencesPromise;
  this.contactTypes = await contactTypesPromise;
  const stateParams = this.$state.params;
  return this.setContactSteps();
}

注意初始调用是如何相同的,我们仍然希望捕获promises,因为我们希望两个请求同时运行。

答案 1 :(得分:0)

Promise.all / async语法中没有替代await。它仍然适用于承诺,它只是then来电的糖。

所以使用

async $onInit() {
  const referencesPromise = this.ReferenceService.getMultipleReferences(this.AgentReferences)
  const contactTypesPromise = this.ContactService.getContactTypes()
  const responses = await Promise.all([referencesPromise, contactTypesPromise])
  this.references = responses[0]
  this.contactTypes = responses[1]
  const stateParams = this.$state.params
  return this.setContactSteps()
}

(这与原始代码有点不同,原始代码没有return来自$onInit的任何内容,不确定这是否是故意的 - async函数总是返回一个承诺)

答案 2 :(得分:-1)

根据给定示例,您可以使用$ q.all()替换您的需要,如下所示,

$q.all([this.ReferenceService.getMultipleReferences(this.AgentReferences), this.ContactService.getContactTypes()]).then(function(result) {
    this.referencesPromise = result[0];
    this.contactTypesPromise = result[1];
    this.stateParams = this.$state.params;
    return this.setContactSteps();
});