【问题标题】:Waiting for async call in Angular2+等待Angular 2中的异步调用
【发布时间】:2018-08-20 05:27:53
【问题描述】:

我有办法:

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

【问题讨论】:

  • this.getCalendarDaysFrom(data); 行下方的订阅函数中添加this.dataSaved.emit(this.daysToAdd);。因为作为它的异步调用,可以在其订阅中完成数据发射

标签: angular typescript asynchronous frontend


【解决方案1】:

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

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

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

【讨论】:

  • 是的,正如您在评论中提到的那样,它有所帮助。谢谢:)
猜你喜欢
  • 1970-01-01
  • 2017-06-10
  • 2019-09-29
  • 1970-01-01
  • 2021-06-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多