构建调用第二个 http 服务以向模型添加附加数据的 rxjs 管道序列

Question

问题：我是 RXJS 的新手，很难更改正在获取 http 数据并将其有条件地保存在存储中的管道（如果状态处于活动状态）。缺少的属性之一，我需要逐项使用另一个 http 服务，以在保存到商店之前获取该缺少的属性。无需对具有 active=false 标志的项目调用第二个 http 服务。

例子：

获取http数据的2种方法：

FetchHttpData1() : Observable<IMainModelType[]>

FetchHttpItemProperty(id:number) : Observable<IMissingPropertyType>

楷模：

interface IMainModelType {
  id:number,
  name:string,
  missingProperty:string, //always null
  active:boolean
}

interface IMissingPropertyType{
  id:number,
  missingProperty:string
}

到目前为止的代码：

let myObs = this.FetchHttpData1().pipe(
  map((values) => { 
    values.forEach((singleValue) => {

      if(singleValue.active) {
        //this singleValue is being saved with a missing property and we dont want that
        //at this stage I need to response from FetchHttpItemProperty() to try and set the missing property
        this.storeSetSingle(singleValue);
      }
      
    });
  })
);

关于如何添加额外步骤来调用 this.FetchHttpItemProperty(id) 并确保 this.storeSetSingle() 中设置的项目已定义缺少的属性的建议？

我知道这可能是非常基本的，但我现在为此苦苦挣扎了一段时间，您的建议将是学习的机会。如果您认为当前的管道可以更好地建造，也欢迎提出建议。

Answer 1

const missingApi$ = (x: IMainModelType) => this.FetchHttpItemProperty(x.id).pipe(
  map(({ missingProperty }) => ({...x, missingProperty})),
  tap((val) => this.storeSetSingle(val)),
);

let myObs = this.FetchHttpData1().pipe(switchMap((arrs) => 
  forkJoin(arrs.map((x) => x.active ? missingApi$(x) : of(x)))
));