Angular:按照调用顺序接收响应

嗨,我很新angular度和观察

我正在试图通过一个循环获取他们的ID的对象。 但是不要收到我的回应。

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

是否有可能让我的对象恢复秩序? 以下是我多次拨打我的服务function的地方:

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

这是我在我的服务function,我收到的数据(不按顺序与调用)。

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

forkJoin给你less一点代码,

 const arrayOfFetches = this.contactsAttendance .map(attendee => this.practiceService.GetPracticebyDBID(attendee.practiceId) ); Observable.forkJoin(...arrayOfFetches) .subscribe((practices: Practice[]) => { this.practicesAttendance = practices; this.ExportExcelAttendance2(); }); 

编辑捕捉! @Anas打败了我。 虽然,我不认为你需要concatAll()

你应该使用concatAll运算符来确保依次调用你的observable。

另外,您可以使用completedcallback来调用ExportExcelAttendance2而不是检查每个响应callback中的practicesAttendance ExportExcelAttendance2长度。

检查下面的例子:

 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操作符,当所有观察对象完成时, forkJoin操作符将把所有传入的观察对象的最后一个值发送给一个用户。

检查下面的例子:

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

forkJoin operator使用简单。 它等待所有的观察结果完成,然后发射一个arrays,发射所有的物体。

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