将 combineAll 与 2 个可观察对象一起使用时 RxJS 缺失值答案

【问题标题】：RxJS missing values when using combineAll with 2 observables将 combineAll 与 2 个可观察对象一起使用时 RxJS 缺失值
【发布时间】：2019-08-06 07:31:10
【问题描述】：

我正在尝试为板球比赛模拟生成overs，其值如下：

Overs -> 0 - 19（共 20 次）
球 -> 1 - 6（共 120 个，每个以上有 6 个球）

因此必须生成的序列类似于0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 1.1, 1.2, 1.3, ....., 19.4, 19.5, 19.6

我可以通过使用 2 个嵌套循环进行迭代来轻松实现这一点，但由于我在 RxJS 中使用 angular，所以我想以反应方式来实现这一点。我想出了以下代码，它应该适用于 AFAIK：

import { range } from 'rxjs';
import { map, combineAll } from 'rxjs/operators';

let overs = range(0, 20);

let balls = range(1, 6);

let ob = overs.pipe(
  map((over) => balls.pipe(
    map((ball) => `${over}.${ball}`)
  ))
).pipe(combineAll())

ob.subscribe((val) => console.log(val));

但问题在于，它缺少很多值。我得到以下输出：

[ '0.6',
  '1.6',
  '2.6',
  '3.6',
  '4.6',
  '5.6',
  '6.6',
  '7.6',
  '8.6',
  '9.6',
  '10.6',
  '11.6',
  '12.6',
  '13.6',
  '14.6',
  '15.6',
  '16.6',
  '17.6',
  '18.6',
  '19.1' ]
[ '0.6',
  '1.6',
  '2.6',
  '3.6',
  '4.6',
  '5.6',
  '6.6',
  '7.6',
  '8.6',
  '9.6',
  '10.6',
  '11.6',
  '12.6',
  '13.6',
  '14.6',
  '15.6',
  '16.6',
  '17.6',
  '18.6',
  '19.2' ]
[ '0.6',
  '1.6',
  '2.6',
  '3.6',
  '4.6',
  '5.6',
  '6.6',
  '7.6',
  '8.6',
  '9.6',
  '10.6',
  '11.6',
  '12.6',
  '13.6',
  '14.6',
  '15.6',
  '16.6',
  '17.6',
  '18.6',
  '19.3' ]
[ '0.6',
  '1.6',
  '2.6',
  '3.6',
  '4.6',
  '5.6',
  '6.6',
  '7.6',
  '8.6',
  '9.6',
  '10.6',
  '11.6',
  '12.6',
  '13.6',
  '14.6',
  '15.6',
  '16.6',
  '17.6',
  '18.6',
  '19.4' ]
[ '0.6',
  '1.6',
  '2.6',
  '3.6',
  '4.6',
  '5.6',
  '6.6',
  '7.6',
  '8.6',
  '9.6',
  '10.6',
  '11.6',
  '12.6',
  '13.6',
  '14.6',
  '15.6',
  '16.6',
  '17.6',
  '18.6',
  '19.5' ]
[ '0.6',
  '1.6',
  '2.6',
  '3.6',
  '4.6',
  '5.6',
  '6.6',
  '7.6',
  '8.6',
  '9.6',
  '10.6',
  '11.6',
  '12.6',
  '13.6',
  '14.6',
  '15.6',
  '16.6',
  '17.6',
  '18.6',
  '19.6' ]

正如我们所看到的，所有的都生成了 (0-19)，但我们只得到了 .6 的值。只有最后一个，即19th 具有唯一值19.1, 19.2...

我在这段代码中遗漏了什么？

此外，如果您想在浏览器中尝试和试验，请参考上述代码的 repl：https://repl.it/@ishankhare07/cricket-overs

【问题讨论】：

如前所述，我知道如何使用普通的旧 javascript 生成这样的系列。我要避免的是嵌套循环。事实上，我什至设法以更多的 ES6 风格来做——看这个 -> repl.it/@ishankhare07/cricket-overs-1

标签： typescript rxjs observable rxjs-pipeable-operators

【解决方案1】：

你甚至不需要使用combineAll，而是使用mergeMap，这样更容易理解。

import { range } from 'rxjs';
import { map, mergeMap } from 'rxjs/operators';

let overs = range(0, 20);
let balls = range(1, 6);

let ob = overs.pipe(
  mergeMap((over) => balls.pipe(
    map((ball) => `${over}.${ball}`),
  )),
); 

ob.subscribe((val) => console.log(val));

现场演示：https://stackblitz.com/edit/rxjs-aud3ot

【讨论】：

优秀的解决方案！