Question

您好我是Angular和Observables的新手

我试图通过循环获取他们的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()));
    }

Answer 1

你应该使用concatAll运算符来确保按顺序调用你的observable。

另外，您可以使用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();
    }
  );

如果你仍然希望你的observable并行运行，你可以使用forkJoin运算符，当所有的observable都完成时，它会将所有传递的observable的最后一个值发送给一个订阅者。

检查以下示例：

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

Answer 2

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

Answer 3

forkJoin operator易于使用。它等待所有可观察量完成，然后发出一个包含所有发射物品的数组。

＆＃13;

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

＆＃13;

Angular：按顺序接收响应

3 个答案: