当forkJoin

时间:2017-07-04 08:43:55

标签: javascript angular rxjs reactive-programming

我想要实现的是(使用Angular 2 / Typescript):

  • Observable A产生事件流。

  • 对于Observable A的每个事件,进行8次不同的http调用。 (8个转换图)

  • 在所有8个请求返回后,执行某些操作(订阅8个切换映射的zip)。

  • 对Observable A的每个事件重复8次请求(由switchmap和zip处理)

代码:( https://plnkr.co/edit/44yqw0RYzC7v1TFACMx1处的完整代码)

let source = Observable
.interval(5000)
.take(100);

let requests = [];

for(let i=0; i<8;i++) {
  let request = source.switchMap(x=> http.get('https://jsonplaceholder.typicode.com/users/'+(i+1))).publish();
  request.subscribe(res => console.log(res.json()));
  requests.push(request);
}

Observable.zip(requests)
.subscribe(console.log("All requests completed"));

requests.forEach(r => r.connect());

问题是我的zip永远不会被调用。我console.log'对8个切换映射中的每一个进行了订阅,并且每次在Observable / stream A中有一个事件时,我都会看到显示8个http调用成功返回的日志。(也可以看到在网络选项卡中返回的8个调用)调试工具)

但是zip永远不会发出任何东西。

如果我尝试不同的(不太理想的)方法:

  • 订阅Observable A一次(不是switchmap)
  • 在订阅中为每个http调用创建8个Observable,并订阅8 Observables的ForkJoin

代码:( https://plnkr.co/edit/GqQde1Ae2licBjtL0jcj处的完整代码)

let source = Observable
.interval(5000)
.take(100);

 source.subscribe(x=> {
   console.log(x);
   let requests = [];

   for(let i=0; i<8;i++) {
     let request = http.get('https://jsonplaceholder.typicode.com/users/'+(i+1)).publish();
     request.subscribe(res => console.log(res.json()));
     requests.push(request);
   }

   Observable.forkJoin(requests)
   .subscribe(console.log("All requests completed"));

   requests.forEach(r => r.connect());

 });

这很有效。但是,每次Observable A发出时,我都会创建8 + 1嵌套的observables / subscriptions。

(在这两种情况下,我都使用发布/连接来共享/重用订阅,但即使没有它也存在问题)

1 个答案:

答案 0 :(得分:2)

如果使用多个参数正确调用zip并将函数传递给subscribe(而不是未定义的console.log的结果),则第一个示例将起作用。 Demo

Observable.zip(...requests) // <-- spread this 
    .subscribe(() => console.log("All requests completed")); // <-- pass a function

requests.forEach(r => r.connect());