Rx.js：从promise列表获取所有结果作为数组

Question

这是演示：

 var availableNews$ = Rx.Observable.fromPromise(fetch('https://hacker-news.firebaseio.com/v0/topstories.json?print=pretty').then(res => res.json())); var pager$ = new Rx.Subject(); var fetchedNews$ = Rx.Observable.combineLatest(availableNews$, pager$, (news, pager) => news.slice((pager.current - 1) * pager.items_per_page, pager.items_per_page)) .flatMap(id => id) .map(id => Rx.Observable.fromPromise(fetch(`https://hacker-news.firebaseio.com/v0/item/${id}.json?print=pretty`).then(res => res.json())) .concatMap(res => res)); pager$.subscribe(v => { console.log(v); document.querySelector('#pager').textContent = JSON.stringify(v); }); fetchedNews$.subscribe(x => { console.log(x); document.querySelector('#news').textContent = JSON.stringify(x);; }) pager$.next({current: 1, items_per_page: 10}) 

 <script src="https://unpkg.com/@reactivex/rxjs/dist/global/Rx.js"></script> pager: <p id="pager"></p> news: <p id="news"></p> <p>the news return obserable instance instead of <em>array of fetched news</em> which is desired</p> 

我在代码中执行以下操作：

1，获取热门新闻提要（availableNews $）

2，使用寻呼机来限制应该提取哪些提要（pager $）

3，获取新闻，它应该是一个数组（fetchedNews $）

但是我在第3步很烂，返回的结果是每个promiseObserable的流，而不是每个Promise整理成数组的结果。

感谢您的帮助^ _ ^

-编辑-

我问这个问题作为github上rxjs的问题 ，并获得更好的解决方案。 这是代码：

const { Observable } = Rx;
const { ajax: { getJSON }} = Observable;

var availableNews$ = getJSON('https://hacker-news.firebaseio.com/v0/topstories.json?print=pretty');
var pager$ = new Rx.Subject();
var fetchedNews$ = Observable
  .combineLatest(availableNews$, pager$, (news, {current, items_per_page}) => {
    return news.slice((current - 1) * items_per_page, items_per_page);
  })
  .switchMap((ids) => Observable.forkJoin(ids.map((id) => {
    return getJSON(`https://hacker-news.firebaseio.com/v0/item/${id}.json?print=pretty`);
  })));

pager$.subscribe(v => {
  document.querySelector('#pager').textContent = JSON.stringify(v);
});

fetchedNews$.subscribe(stories => {
   document.querySelector('#news').textContent = JSON.stringify(stories);  
});

pager$.next({current: 1, items_per_page: 10})

Answer 1

您有两个或三个错误的组合。

首先，您的combineLatest()中的lambda不会对新闻ID数组进行操作，而是对包含该数组的单个项进行操作。 所述flatmap()因此，没有必要，因为是concatMap()

其次，您无需从fetch()创建Observable ，因为

第三，您拥有的combineLatest()不会在加载新闻时提供combineLatest()的Promise，而是在加载availableNews和寻呼机时会满载。 因此，您必须使用combineLatest()使第三个Observable combineLatest() ，但是必须从fetch()承诺数组中进行。 然后，在第二个subscribe()该内容，如下所示：

 var availableNews$ = Rx.Observable.fromPromise(fetch('https://hacker-news.firebaseio.com/v0/topstories.json?print=pretty').then(res => res.json())); var pager$ = new Rx.Subject(); var fetchedNews$ = Rx.Observable.combineLatest(availableNews$, pager$, (news, pager) => Rx.Observable.combineLatest.apply(this, news.slice((pager.current - 1) * pager.items_per_page, pager.items_per_page) .map(id => fetch(`https://hacker-news.firebaseio.com/v0/item/${id}.json?print=pretty`).then(res => res.json())))); pager$.subscribe(v => { document.querySelector('#pager').textContent = JSON.stringify(v); }); fetchedNews$.subscribe(x => { x.subscribe(a => { document.querySelector('#news').textContent = JSON.stringify(a); }); }) pager$.next({current: 1, items_per_page: 10}) 

 <script src="https://unpkg.com/@reactivex/rxjs/dist/global/Rx.js"></script> pager: <p id="pager"></p> news: <p id="news"></p> <p>the news return obserable instance instead of <em>array of fetched news</em> which is desired</p>