时间戳

首页 > 解决方案 > 等待Angular2+中的异步调用

angular - 等待Angular2+中的异步调用

问题描述

我有方法：

  prepareCalendarDaysToAdd() {
    this.getDaysToAdd();        //first line
    this.dataSaved.emit(this.daysToAdd); //second line
  }

方法 getDaysToAdd() 是一个异步调用：

getDaysToAdd() {
    this.daysService.getDaysInSpecificYearWith(this.toDate.year).subscribe(
      data => {
        this.getCalendarDaysFrom(data);
      },
      error => { console.error(error); },
      () => {
        this.getCalendarDaysBetween();
      }
    )
  }

问题是数据在准备好之前就发出了。我如何 w8 确定来自第一行的异步调用是否完成？

所以我试图得到的确切代码是：

  prepareCalendarDaysToAdd() {
    if getDaysToAdd is finished then emit list of days
  }

我试图处理解决这个问题的承诺，但似乎我不明白它应该如何工作。

prepareCalendarDaysToAdd() {
     const promise = new Promise((resolve, reject) => {
      this.getDaysToAdd();        //first line
      resolve();
      })
      .then(
      () => {
        this.dataSaved.emit(this.daysToAdd); //second line
        }
      );
    });

标签： angulartypescriptasynchronousfrontend

解决方案

使用以下代码解决您的问题：

在下面添加this.dataSaved.emit(this.daysToAdd);内部订阅函数this.getCalendarDaysFrom(data);作为其异步调用，以便可以在其订阅中完成数据发送

prepareCalendarDaysToAdd() {
    this.getDaysToAdd();        //first line
    // removed second line
  }

getDaysToAdd() {
    this.daysService.getDaysInSpecificYearWith(this.toDate.year).subscribe(
      data => {
        this.getCalendarDaysFrom(data);
        this.dataSaved.emit(this.daysToAdd); // Added in success block of subscription
      },
      error => { console.error(error); },
      () => {
        this.getCalendarDaysBetween();
      }
    )
  }

推荐阅读