如何将可观察变量数组合并为具有相同返回类型的单个可观察变量

时间:2019-01-11 23:40:00

标签: angular typescript rxjs reactive-programming ngrx

我要实现的目标是在数组中推送一些http请求的可观察对象,然后将所有响应组合在一起并返回一个可观察对象。

由于所有http请求都以相同的类型'User'进行解析,所以我只想等待所有HTTP请求都解析,然后可以从getUsers()函数返回一个包含所有Users的可观察对象。

由于无法正确使用返回类型,而且我不太精通Rxjs函数,因此我陷入了return merge(observableRequests)部分。

这是我的三个相关功能。

    getMyUser(): Observable<User> {
        return this.service.get(`${this._userPath}me`).pipe(
            map((serviceUser: any) => {
                return parseUser(serviceUser);
            }));
    }

    getUsers(): Observable<User[]> {
        return this.getMyUser()
            .pipe(switchMap((user: User) => {
                const activeProvidersIds = this._getActiveProvidersIds(user.providers);
                const observableRequests = activeProvidersIds.map((id: number) => this.getUserRequest(id));
                return merge(observableRequests);
            }));
    }

    getUserRequest(facDbk: number): Observable<User[]> {
        return this.service.get(`${this._providerPath}${facDbk}/users`).pipe(
            map((serviceUsers: any) => {
                return parseUsers(serviceUsers);
            })
        );
    }

感谢您的帮助。

2 个答案:

答案 0 :(得分:2)

我想您正在寻找forkJoin

When all observables complete, emit the last emitted value from each.

https://www.learnrxjs.io/operators/combination/forkjoin.html

以下是一个可以帮助您的示例:

https://stackblitz.com/edit/angular-seuqh5

答案 1 :(得分:1)

ForkJoin将在您的用例中工作,您可以遵循此代码

import { Observable, of, forkJoin } from 'rxjs'; 
import { map } from 'rxjs/operators';

interface user {
  id : string;
  name: string;
}

// mimicking api requests
const httpRequest = (num): Observable<user> =>{
  return Observable.create((observer)=>{
    const [id,name] = [`id-${num}`,`name-${num}`];
    setTimeout(()=>{
     observer.next({id,name});
     observer.complete();
    },num*1000);
  });
}

//push array of request observables and return single observable
// you can push any number of request here 
const makeRequestInParallel = ():Observable<user> =>{
  const reqs:Observable<user>[] = [httpRequest(1),httpRequest(2),httpRequest(3)];
  return forkJoin(...reqs);
}


makeRequestInParallel().subscribe((result)=>{
  console.log(result);
});


点击stablitz-link