RxJS 从发出的 observable 中获取值答案

【问题标题】：RxJS take value from observable that emittedRxJS 从发出的 observable 中获取值
【发布时间】：2020-02-08 05:59:25
【问题描述】：

我有两个 observables，searchText 和 offset。当用户在文本框中输入某些条件时，搜索文本会发出一个值，而当用户无限滚动滚动结果时，会发出偏移量。

我在这里要做的是将我的infiniteSiteList 设置为实际发出该值的可观察对象的结果。例如，如果用户只是滚动，并且无限滚动中有更多结果，则应将infiniteSiteList 设置为batchMap 的输出，但是，如果用户正在输入一些文本进行搜索，则infiniteSiteList应设置为searchMap 的输出。我在想race 是正确的运算符，但是，它似乎只需要batchMap 的第一个值，所以它破坏了滚动行为。我可以使用什么 RxJS 运算符来执行此操作？

const searchMap = this.searchText.pipe(
    throttleTime(500),
    mergeMap(searchText => this.getBatch(null, searchText))
);

const batchMap = this.offset.pipe(
    throttleTime(500),
    mergeMap(n => this.getBatch(n, this.searchText.getValue())),
    scan((acc, batch) => {
        return [...acc, ...batch];
    }, new Array<SiteListItem>())
);

this.infiniteSiteList = race([searchMap, batchMap]).pipe(
    tap(data => console.log(data))
);

【问题讨论】：

您需要关闭初始搜索，然后进入分页。这样每次新的搜索都会重置分页
比赛操作员的目的不同。对于您的用例，您可以放弃订阅 observable 的管道。相反，只需订阅。在 subscribe 的处理函数中，您可以将infiniteSiteList 设置为结果。您仍然可以通过 subscribe 使用限制。
如果您想采用我建议的方法，我可以为您的用例发布一个 sn-p。
使用@blid 回答，您可以使用merge() 减少代码更改。先试试吧。

标签： angular rxjs

【解决方案1】：

race 将检查哪个可观察对象首先发出，然后只从该可观察对象中获取值。

这完全取决于您希望如何在infiniteSiteList 的源之间进行交换。如果您希望能够无限期交换：

this.infiniteSiteList = merge(batchMap, searchMap);

如果您想从一个交换到另一个，但又不想再返回，那么只需添加一个takeUntil。

const batchMap = this.offset.pipe(
   ...,
   takeUntil(searchMap)
);

this.infiniteSiteList = merge(batchMap, searchMap);

【讨论】：

通过合并是否可以找出发出的值来自哪个 observable（batchMap 或 searchMap）？因为两者的处理方式不同。