RxJs 数组的 Observable 到 Observable 的数组 [英] RxJs Array of Observable to Observable of Array

问题描述

对于在 TypeScript 中使用 Angular2 编写的 Web 应用程序，我需要使用 RxJs Observables.
由于我以前从未使用过 rxjs，而且我对反应式编程总体上是新手，因此有时我很难找到正确的方法来做一些特定的事情.
我现在面临一个问题.我必须将 Array> 转换为 Observable>.
我会试着用一个例子来解释它:

For a Web-Application written with Angular2 in TypeScript, I need to work with RxJs Observables.
As I never used rxjs before and I am new to reactiveprogramming in general, I sometimes have some difficulties finding the right way to do some specific things.
I am now facing a problem. where I have to convert an Array<Observable<T>> into an Observable<Array<T>>.
I'll try to explain it with an example:

• 我有一个 Observable，它给了我一个 Users 列表(Observable>)
• User 类有一个函数 getPosts 返回一个 Observable>.
• 我需要将 Observable> 映射到 Observable> 以评估所有 PostonNext 函数中的 code>s.

• I have an Observable, which gives me a list of Users (Observable<Array<User>>)
• The User-class has a function getPosts returning an Observable<Array<Post>>.
• I need to map the Observable<Array<User>> to an Observable<Array<Post>> to evaluate all the Posts inside the onNext function.

我可以使用
轻松地从Observable>映射到Observable>>/>map((result : Array) => result.map((user : User) => user.getPosts()))
我可以将 Array> 展平为 Array.
但是，我只是找不到将 Observable>> 映射到 Observable> 的正确方法;>
到目前为止，我将 combineLatest 函数与 flatMap 一起使用.
对我来说它似乎工作，我使用的编辑器(Atom 编辑器)没有显示任何错误.但是现在我使用 Netbeans，它显示了这段代码中的一个错误.还使用tsc"编译代码导致以下错误:

I can easily map from Observable<Array<User>> to Observable<Array<Observable<Array<Post>>>> using
map((result : Array<User>) => result.map((user : User) => user.getPosts()))
and I can flatten an Array<Array<Post>> into an Array<Post>.
However I just can't find the correct way to map the Observable<Array<Observable<Array<Post>>>> into an Observable<Array<Array<Post>>>
Until now i used the combineLatest function together with flatMap.
To me it seemed to work and the editor i used (Atom editor) did not show any error. However now I use Netbeans, which shows me an error in this code. Also compiling the code using "tsc" results in the following errors:

Argument of type '(result: Post[]) => void' is not assignable to parameter of type 'NextObserver<[Observable<Post>]> | ErrorObserver<[Observable<Post>]> | CompletionObserver<[...'.
Type '(result: Post[]) => void' is not assignable to type '(value: [Observable<Post>]) => void'.  

所以我的问题是:
我怎样才能扁平化"?将 Observables 的 Array 转换成 Array?

So my question is:
How can I "flatten" an Array of Observables into an Array?

推荐答案

flatMap 运算符允许这样做.我不完全理解您尝试做什么，但我会尽力提供答案...

The flatMap operator allows to do that. I don't fully understand what you try to do but I'll try to provide an answer...

如果你想加载所有

getPostsPerUser() {
  return this.http.get('/users')
    .map(res => res.json())
    .flatMap((result : Array<User>) => {
      return Observable.forkJoin(
        result.map((user : User) => user.getPosts());
    });
}

Observable.forkJoin 允许您等待所有 observable 接收到数据.

Observable.forkJoin allows you to wait for all observables to have received data.

上面的代码假设 user.getPosts() 返回一个 observable...

The code above assumes that user.getPosts() returns an observable...

这样，您将收到一系列帖子:

With this, you will receive an array of array of posts:

this.getPostsPerUser().subscribe(result => {
  var postsUser1 = result[0];
  var postsUser2 = result[1];
  (...)
});

这篇关于RxJs 数组的 Observable 到 Observable 的数组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！