Angular：接收响应的顺序与调用

您好我对Angular和Observables来说很新颖Angular：接收响应的顺序与调用

我想通过循环的方式获取对象的ID。但没有收到我的订单响应。

例

get ID(1) 
get ID(2) 
get ID(3) 
Receive Object ID(2) 
Receive Object ID(3) 
Receive Object ID(1)

是否有可能让我回来的对象，以便？下面是我多次调用我的服务功能：

conferences-attendance.component.ts

ExportExcelAttendance() { 
 
    for (var i = 0; i < this.contactsAttendance.length; i++) { 
 
     this.practiceService.GetPracticebyDBID(this.contactsAttendance[i].practiceId) 
 
     .subscribe(
 
     (practice: Practice) => { 
 
      this.practicesAttendance.push(practice); 
 
      if (this.practicesAttendance.length == this.contactsAttendance.length) { 
 
      this.ExportExcelAttendance2(); 
 
      } 
 
     }, 
 
     error => this.errorMessage = <any>error 
 
     ); 
 
    } 
 
    }

这是我在我的服务功能，在那里我得到的数据（不是为了与电话）。

practices.service.ts

GetPracticebyDBID(id: string) { 
 
     let params: URLSearchParams = new URLSearchParams(); 
 
     params.set('thisId', id); 
 
     let requestOptions = new RequestOptions(); 
 
     requestOptions.params = params; 
 
     return this.http.get('http://ec2-34-231-196-71.compute-1.amazonaws.com/getpractice', requestOptions) 
 
      .map((response: Response) => { 
 
       return response.json().obj; 
 
      }) 
 
      .catch((error: Response) => Observable.throw(error.json())); 
 
    }

来源

2017-12-02 Pfeiff86

forkJoin给你一点点更少的代码，

const arrayOfFetches = this.contactsAttendance 
    .map(attendee => this.practiceService.GetPracticebyDBID(attendee.practiceId)); 

Observable.forkJoin(...arrayOfFetches) 
    .subscribe((practices: Practice[]) => { 
     this.practicesAttendance = practices; 
     this.ExportExcelAttendance2(); 
    });

编辑快！ @Anas打败了我。虽然，我不认为你需要的concatAll()

来源

2017-12-02 23:04:57

我同意，但也决定保留'cocncatAll'，有时您需要按顺序运行API调用。例如：注册然后登录。 –

@AnasAlHamdan - 好点！虽然，我指的是concatAll后面的forkJoin，你之后删除了（假设复制粘贴的东西）。 –

你抓住了我：第 –

你应该使用concatAll操作，以确保您的通话观测序列。

此外，您可以使用completed回调调用ExportExcelAttendance2而不是检查每个响应回调中的practicesAttendance长度。

检查下面的例子：

let contactsAttendanceObservables = this.contactsAttendance 
    .map((item) => { 
    return this.practiceService.GetPracticebyDBID(item.practiceId); 
    }); 
Observable.of(...contactsAttendanceObservables) 
    .concatAll() 
    .subscribe(
    (practice: Practice) => { 
     this.practicesAttendance.push(practice); 
    }, 
    (err) => { 
     // handle any errors. 
    }, 
    () => { 
     // completed 
     this.ExportExcelAttendance2(); 
    } 
);

如果你仍然想你的观测并行运行，你可以使用forkJoin运营商，这将在所有所有的经过观测的最后一个值发射到一个用户观测结束。

检查下面的例子：

let contactsAttendanceObservables = this.contactsAttendance 
    .map((item) => { 
    return this.practiceService.GetPracticebyDBID(item.practiceId); 
    }); 
Observable.forkJoin(...contactsAttendanceObservables) 
    .subscribe(
    (practices: Practice[]) => { 
     this.practicesAttendance = practices; 
     this.ExportExcelAttendance2(); 
    } 
);

来源

2017-12-02 22:55:11

太感谢你了！这是什么意思......在Observable.of（... contactsAttendanceObservables）。还有什么 – Pfeiff86

在这里你去：传播语法https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator –

我买了[TS]类型的参数“的错误（已完成：任何=>空隙不能分配给类型的参数“（）=>无效”。 – Pfeiff86

的forkJoin operator简单易用。它等待，直到所有的可观测量完成，则发射阵列与所有项发射。

ExportExcelAttendance() { 
 
    const all = this.contactsAttendance.map(it => this.practiceService.GetPracticebyDBID(it.practiceId)); 
 
    Rx.Observable.forkJoin(all) 
 
    .subscribe(
 
     practicesAttendance => this.ExportExcelAttendance2(practicesAttendance), 
 
     error => this.errorMessage = <any> error); 
 
}

来源

2017-12-02 23:05:51

Angular：接收响应的顺序与调用

回答

相关问题