加载和丰富项目列表的 RxJS 示例

问题描述

我想获取一个包含多个项目的数组，然后为该数组中的每个项目获取并添加额外的数据.

I want to fetch an array containing multiple items and then fetch and add additional data to every item in that array.

鉴于 getItemsList 和 getRelatedObject 的实现，我如何实现方法 getEnrichedItemsList?

How can I implement the method getEnrichedItemsList given the implementations for getItemsList and getRelatedObject?

interface RelatedObject = {}

interface Item = {
  id: string;
  relatedObjectId: string;
}

interface EnrichedItem = Item & {
  relatedObject: RelatedObject ;
}

interface apiService = {
  getItemsList: (query: string) => Observable<Item[]>; // implemented
  getRelatedObject: (relatedObjectId: string) => Observable<RelatedObject>; // implemented
  getEnrichedItemsList: (query: string) => Observable<EnrichedItem[]>; // HOW TO IMPLEMENT?
}

推荐答案

类似这样的事情?

  getEnrichedItemsList(query: string): Observable<EnrichedItem []>{
    return this.getItemsList(query).pipe(
      mergeMap(items => from(items)),
      mergeMap(item => this.getRelatedObject(item.relatedObjectId).pipe(
        map(relatedObject => Object.assign(item,{relatedObject}))
      ))
    );
  }

完整示例:https://stackblitz.com/edit/rxjs-ahllnu

这篇关于加载和丰富项目列表的 RxJS 示例的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！