无法在 angular 2 上使用多个异步链函数

迭戈

我目前正在学习 Angular 2 对不起,如果我太菜了,但我似乎无法使用多个链异步函数......

我将尝试解释和缩写我的代码,我正在向 API 请求一个 get 方法,它是一个员工列表,员工列表必须显示在一个当前工作正常的表中,该表称为“listToDisplay”,但是问题是当日历显示时,它没有显示我在 listEmployeeBirthday 中填写的任何生日

我发现当我调用 updateCalendar 方法时,系统不会等待 listEmployeeBirthday 被填写,正如我在代码中所示,我控制台记录了 listEmployeeBirthday 并且它正确填写但出现警告消息:“下面的值已评估现在”。我已经尝试了一切来解决这个问题,但我似乎没有得到在 getEmployees 完成后执行 updateCalendar 的工作。

我将不胜感激任何帮助

ngOnInit(){

  this.getEmployees()

  this.updateCalendar()

  console.log("listEmployeeBirthday")

}



getEmployees(){

  this.http.get("apiadress...")
      .flatMap((response:Response) => response.json());
      .map((employee)=>{
        this.addCalendar(employee);
        this.listToDisplay.push(employee)
        })
      .subscribe();
}

addCalendar(employee){
  this.listEmployeeBirthday.push(employee.birthdate);
}


updateCalendar(){
  methodToUpdateCalendar(this.listEmployeeBirthday)
}
谢尔盖·索科洛夫

是的,您的updateCalendar函数不执行任何操作,因为它getEmployees是异步的。所以你需要在员工加载时更新日历:

this.http.get("apiadress...")
  .flatMap((response:Response) => response.json())
  .map((employee)=>{
    this.addCalendar(employee);
    this.listToDisplay.push(employee);
  })
  .subscribe(() => {
    this.updateCalendar();
  });

顺便说一句,map运算符应该用于实际映射数据,而不是用于执行某些操作。更好的方法是:

this.http.get("apiadress...")
  .flatMap((response:Response) => response.json())
  .subscribe(() => {
    this.addCalendar(employee);
    this.listToDisplay.push(employee);

    this.updateCalendar();
  });

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Angular2 上的异步函数

来自分类Dev

Angular 2 无法从函数中获取价值

来自分类Dev

无法使用Angular 2导入Toastr模块

来自分类Dev

无法使用 angular 2 执行登录验证

来自分类Dev

使用Dragula的angular2无法重新排序多个tbody

来自分类Dev

Angular2-Sass无法在angular-cli上构建

来自分类Dev

Angular2-Sass无法在angular-cli上构建

来自分类Dev

aviary(adobe creative SDK)在angular 2上无法正常使用

来自分类Dev

无法在ngFor Angular2内部的元素上调用函数

来自分类Dev

Promise链上的2个函数被异步调用

来自分类Dev

Angular 2类无法识别

来自分类Dev

Angular 2:无法呈现 json

来自分类Dev

Angular 2 AsynPipe无法与Observable一起使用

来自分类Dev

无法使用ES5在Angular 2中创建Pipe

来自分类Dev

Ionic 2段无法与Angular指令一起使用

来自分类Dev

如果不使用超时,Angular 2焦点将无法工作

来自分类Dev

无法在* ngFor中使用* ngIF:angular2

来自分类Dev

无法在Angular 2中使用ng属性

来自分类Dev

Angular2无法使用JavaScript导入FormsModule

来自分类Dev

Angular 2 - 无法使用 ViewChild 或 ContentChild 获取基类实例

来自分类Dev

无法使用 Angular 2 的 Route 参数显示 url 的值

来自分类Dev

使用gulp-typescript获得“无法找到模块'angular2 / angular2'”

来自分类Dev

Angular无法对我的Observables使用异步管道

来自分类Dev

spyOn无法在Angular中使用异步管道

来自分类Dev

Angular 2路由器无法与传递的多个参数一起使用

来自分类Dev

使用流体布局的 Angular 2 Web 应用程序无法响应多个屏幕尺寸

来自分类Dev

使用Visual Studio 2015在Angular 2上无法编译的Typescript文件

来自分类Dev

Angular2动画(变换)在iPhone 6s上无法使用

来自分类Dev

无法在 Angular2 中的一组单选按钮上使用 [formControl]

Related 相关文章

  1. 1

    Angular2 上的异步函数

  2. 2

    Angular 2 无法从函数中获取价值

  3. 3

    无法使用Angular 2导入Toastr模块

  4. 4

    无法使用 angular 2 执行登录验证

  5. 5

    使用Dragula的angular2无法重新排序多个tbody

  6. 6

    Angular2-Sass无法在angular-cli上构建

  7. 7

    Angular2-Sass无法在angular-cli上构建

  8. 8

    aviary(adobe creative SDK)在angular 2上无法正常使用

  9. 9

    无法在ngFor Angular2内部的元素上调用函数

  10. 10

    Promise链上的2个函数被异步调用

  11. 11

    Angular 2类无法识别

  12. 12

    Angular 2:无法呈现 json

  13. 13

    Angular 2 AsynPipe无法与Observable一起使用

  14. 14

    无法使用ES5在Angular 2中创建Pipe

  15. 15

    Ionic 2段无法与Angular指令一起使用

  16. 16

    如果不使用超时,Angular 2焦点将无法工作

  17. 17

    无法在* ngFor中使用* ngIF:angular2

  18. 18

    无法在Angular 2中使用ng属性

  19. 19

    Angular2无法使用JavaScript导入FormsModule

  20. 20

    Angular 2 - 无法使用 ViewChild 或 ContentChild 获取基类实例

  21. 21

    无法使用 Angular 2 的 Route 参数显示 url 的值

  22. 22

    使用gulp-typescript获得“无法找到模块'angular2 / angular2'”

  23. 23

    Angular无法对我的Observables使用异步管道

  24. 24

    spyOn无法在Angular中使用异步管道

  25. 25

    Angular 2路由器无法与传递的多个参数一起使用

  26. 26

    使用流体布局的 Angular 2 Web 应用程序无法响应多个屏幕尺寸

  27. 27

    使用Visual Studio 2015在Angular 2上无法编译的Typescript文件

  28. 28

    Angular2动画(变换)在iPhone 6s上无法使用

  29. 29

    无法在 Angular2 中的一组单选按钮上使用 [formControl]

热门标签

归档