在Angular中将多个Http流与RxJS Observables结合

时间:2018-07-10 05:15:14

标签: angular rxjs observable

我试图使以下流与map和flatMap一起工作,但是它做了应做的事情,但是代码不是最佳的,例如,我第二次使用flatMap时,我从未读取过它的响应值,但是我只是不知道如何继续操作,如果我将其删除,则会收到错误

  

类型'Observable'的参数不能分配给参数   类型为'(outerValue:any,innerValue:void,externalIndex:number,   innerIndex:数字)=>任何'

那么我该如何做得更好呢?

  person;
  facility;
  apiUrl1: string = 'http://localhost:3000/person/?';
  apiUrl2: string = 'http://localhost:3000/facility/?';
  apiUrl3: string = 'http://localhost:3000/exposure/?';

  constructor(private http: HttpClient) { }

  getData(arg): Observable<any> {
    return this.http.get(this.apiUrl1 + arg.data)
      .map((response: any) =>
        this.person = response
      )
      .flatMap((response: any) => this.http.get(this.apiUrl2 + response.val1)
        .map((response: any) => {
          this.facility = response
        })
        .flatMap((response: any) => this.http.get(this.apiUrl3 + this.person.val2)
          .map((response: any) => response.val5 * this.facility.val3)))
  }
}

1 个答案:

答案 0 :(得分:1)

如果您打算使用变量this.personthis.facilitythis.exposure只是为了“保留”这些值,以便您可以重新使用先前的http调用的结果,则没有必要这样做。借助.forkJoinarray destructuring,您可以消除它们。

这是一个简短得多,简洁易读的代码:

getData(arg): Observable<any> {
    return this.http.get(this.apiUrl1 + arg.data)
        .flatMap((person: any) => Observable.forkJoin([...this.http.get(this.apiUrl2 + person.val1), this.http.get(this.apiUrl3 + person.val2)]))
        .map(([facility, exposure]) => exposure.val5 * facility.val3)
}

P / S:为变量提供适当的名称(而不是仅将其命名为response)可以帮助吨