Rxjs 调用在页面中返回数据的服务

【问题标题】：Rxjs Invoke service which return data in pagesRxjs 调用在页面中返回数据的服务
【发布时间】：2018-02-08 21:41:05
【问题描述】：

我需要为列表 ["A"、"B"、"C"] 中的每个项目调用 Web 服务。该服务将返回页面中的数据（默认页面大小为 100）。服务的第一次调用（以 page = 1 作为参数）将记录总数设置为响应的标头，并且基于此我需要多次调用该服务。而且我需要等待所有调用的响应，以继续进行进一步的逻辑。任何使用 Rxjs 实现上述内容的指针都会有很大帮助

【问题讨论】：

stackoverflow.com/questions/35254323/rxjs-observable-pagination 这就是你要找的吗？
嗨。我让它满足我的要求，但响应格式不正确。每个服务调用的响应都是一个对象数组。所以我认为在最终流中应该有多个数组对象（如 [{},{}] []{},{} [{},{}]），但我得到的是扁平对象流。（如 {}{}{}）

标签： rxjs rxjs5

【解决方案1】：

使用expand 运算符，您可以递归调用您的api (getData(x)) 来检索分页数据，直到满足您的需求（使用.take(7) 模拟）

function getData(page) {
  return Rx.Observable.of({
    page: page,
    hasMoreData: page !== 4,
    data: [
      page * 10 + 1,
      page * 10 + 2,
      page * 10 + 3,
      page * 10 + 4,
      page * 10 + 5
    ]
  })
  .delay(1000)
  .do(() => console.log('retrieved data for page: ' + page));
}

getData(1)
  .expand(data => {
    if (data.hasMoreData) {
      return getData(data.page + 1);
    }
    return Rx.Observable.empty();
  })
  .mergeMap(dataObj => dataObj.data)
  .take(7)
  .subscribe(val => console.log('data: ' + val));

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.4.2/Rx.js"&gt;&lt;/script&gt;

【讨论】：