Angular 2组合了多个(相似的)可观察量

时间:2017-02-20 14:17:28

标签: angular asynchronous merge observable angular2-observables

我发现了很多例子,详细说明了如何将多个可观察的调用组合成一个Observable调用,但是根据我的发现,这些调用总是至少假定下列之一:

1:已知呼叫次数 2:通话次数是固定的 3:调用是将不同的对象组合成一个。 (如arg1 => call1,arg2 => call2)

但是我没有找到任何关于如何在动态地进行这些调用时处理Observable组合或者不是将结果映射到不同变量的任何正确信息,而是希望扩展到列表中。 ;重新尝试收集。

给出一个适用的用例:用户可以注册多个"组"的产品。每个组都与一个ID链接,该ID用于从远程服务获取产品。该小组将从所有组中获取所有产品,将它们连接在一起,并将它们显示给用户。

对我来说,最合理的解决方案似乎是等到所有调用都完成后将结果收集到另一个列表中,然后从那里将这些列表编译成单个想要的结果很容易,但我可以我们一直无法找到有效实现这一目标的方法 - 我很想知道其他人是否有关于如何最好地解决这个问题的想法。

let responses = Array<Observable<Articles>>
    for (let id of subscriptions) {
        let response = this.http.get(producturl + id, headers).map(
            //insert mapping...
        );
    responses.push(response);
}

从这里开始我尝试使用.merge()尝试合并&#34;响应&#34;在一起,但感觉我对命令不熟悉/误用它。我也尝试迭代Observables并依次订阅它们,但这似乎都是次优的并且没有产生想要的结果。我尝试了更多,但这两个选项在我看来最有可能走上正确的解决方案...如果需要更多的代码来查看潜在问题可能存在的地方,我可以做到这一点。我很乐意分享 - 感谢任何意见。

1 个答案:

答案 0 :(得分:0)

您可以将forkJoin与普通reduce

一起使用
let responses: Array<Observable<Articles>> = [];
for (let id of subscriptions) {
    let response: Observable<Articles> = this.http.get(producturl + id, headers).map();
    responses.push(response);
}

Observable.forkJoin(responses)
   .map(response => response.reduce((a,b) => {return a.concat(b)}))
   .subscribe((response: Articles[]) => {
       console.log(response);
      //output is a flat array of all Articles
});

不要忘记添加rxjs运算符:

import 'rxjs/add/observable/forkJoin';