时间戳

首页 > 解决方案 > 带有商店选择器的 concatMap 与 mergeMap

angular - 带有商店选择器的 concatMap 与 mergeMap

问题描述

我花了很多时间学习mergeMap和concatMap之间的差异，以清楚地理解差异，现在我很清楚了。我在其他网站上使用了很好的资源，例如https://rxjs-dev.firebaseapp.com和https://www.learnrxjs.io 。

这两个运算符都保留传入的源并订阅所有发出的具有不同顺序的值。但是在我的项目中，我遇到了一种情况，使用mergeMap和concatMap与我有很大不同，我想了解原因。

这是一个代码示例：

const Stream$ = from(requiredDocs.documents_type)
          .pipe(
            mergeMap(docID => this._store.select(selectDocumentTypeByID(docID))),
            scan((acc: Array<DocumentType | undefined>, curr) => {
              console.log('curr - ', curr)
              acc.push(curr)
              return acc
            }, [])
          ).subscribe(val => console.log(val))

说明：我从数组requiredDocs.documents_type生成源，然后使用发出的值从使用选择器的商店中选择 - selectDocumentTypeByID(id: number)。后者是一个简单的 Array.find 函数，它返回未定义或找到的对象。然后我使用scan rxjs 运算符从选择器生成结果数组

预期结果： [ {obj}, {obj}, {obj} ] - select observable 返回的三个对象

mergeMap - result is as expected - [ {obj}, {obj}, {obj} ]

concatMap - result is just one obj(*first one*) - [ {obj} ]

如果我将商店选择器更改为 simple of(docID) rxjs 运算符，它会按预期工作。

为什么 concatMap 在与 store selector 一起使用时只返回一个 obj ？

标签： angularrxjs

解决方案

是的，提问的魔法很有效，除了这次有很多痛苦和思考:) 答案在 concatMap 定义中。该操作符订阅每个外部源 Observable 并且仅在上一个已完成时订阅后续

有趣的是，我的脑海里突然出现了一个问题，有点随机:) 经过几个小时的思考。因此，为了让我的示例正常工作，我需要完成 store.selector。我还不知道该怎么做，但对我来说，这两个歌剧之间的区别现在很清楚，这是一件重要的事情。

反过来，mergeMap 不会等待源 Observable 完成，这就是它按我需要工作的原因。祝大家好运:)

推荐阅读