Javascript RxJs Observable并行发出请求，直到失败

我想实现一个API，它以50个项目的页面返回数据，但我不知道有多少个项目（因此页面）

我的想法是并行发送20个请求，每个请求将请求第I个页面，然后请求第I个+20个页面，依此类推，直到一个页面返回空白，在这种情况下，我结束

使用这种方法，我最多可以做20个不必要的请求

问题是，我不知道如何使用可观测数据构造这个循环

我想象的是这样的：

return Observable.from(_.range(0, 20))
  .map((pageNo) => fetchPage(pageNo))
  .while((page) => isValid(page));

但是这种

方法或类似方法不存在/不起作用

我发现了这个类似的问题，但他使用了
间隔
，这似乎效率低下

据我所知，我不能使用takeWhile，因为它验证了已经满足的条件，而不是对仍然要发出的请求的响应。
这可能会有所帮助

return Observable.from(_.range(0, 20)).pipe(
    mergeMap(pageNo => ajax.getJSON(`/api/fetchPage/${pageNo}`).pipe(
        mergeMap(result => 
            of(addPersonFulfilled(result), secondFunc(foo)),
            retryWhen(error => tap(console.log('error on page', error)))
        )           
    ))
)

您可以创建20个请求并等待所有请求通过
forkJoin
完成，然后在结果数组为空时使用
takeWhile
完成链：

const fetchPage = page => {
  ...
  return forkJoin(...);
};

range(0, 20).pipe(
  concatMap(page => fetchPage(page)),
  takeWhile(arr => arr.length > 0),
)
.subscribe(console.log);

完整演示：
很好，谢谢。我不熟悉这个管道功能。在进一步检查你的答案后，我想你误解了我的问题。您的代码触发20个fetchPage，每个fetch（当前记录）20次。stopping子句应该在第二个循环中，而不是第一个循环中。您的意思是在fetchPage（）中？范围中的20是正确的，for循环中的20需要考虑来自请求的响应，即如果该请求中有返回的数据。这就是停止条件应该在的地方（从我思考如何解决问题的方式来看，除非你提出了不同的建议），你能解释一下它的作用吗？