RxJs：如何将两个可观察对象组合成不同类型的新可观察对象

我对

RxJs

和

NgRx store

非常陌生，我想用两个观察值的组合创造一种

@效果

（很难解释）：

我的界面看起来像：

export interface ProductDetails {
  product: Product;
  productBody: ProductBody;
}

export interface ProductBody{
  id: string;
  body: string;
}

我正在尝试创建一个新对象

productDetails

，并设置它的属性。 属性是

product

，其中

payload

具有

product

和

productBody

，后者从

productService（id）

（它返回

可观察的
）

此效果应返回可观察的

这将返回：
Object{productBody:undefined，product:Object}

我理解为什么要为
productBody
返回
undefined
，但不确定如何修复它。我试过使用
zip
，
switchMap
等等，但没有机会
 以下是您可以做的


您希望对原始可观察对象进行
flatMap
，以获取
有效负载.id
，将其交给
getStepBody
可观察对象
然后，在
flatMap
中，您希望
map
在
getStepBody
可观察对象上，返回一个新值，该值是
有效载荷
和
getStepBody
的响应的复合对象
最后
订阅
以获得最终结果

它看起来像这样：

getProductDetails$ = this.actions$
    .ofType(ProductActions.GET_STEP)
    .map(action => action.payload)
    .flatMap(payload => this.productService.getStepBody(payload.id).map(body => ({step: payload, productBody: body})))
    .subscribe(res => this.productActions.getProductDetailsSuccess(res));  //res is an object of {step: payload, productBody: body}

如果不希望将整个对象返回到
subscribe
函数中的单个函数中，可以对值进行分解，使其更易于单独使用。将
subscribe
行更改为：

.subscribe(({step, body}) => {//do something with each value});

.subscribe(({step, body}) => {//do something with each value});