javascript - Rxjs - 组合 2 个 Observables 并发出组合结果不起作用
问题描述
首先,这是我对 rxjs 的导入语句:
import { Subject, Observable, merge, combineLatest } from "rxjs";
import { map } from 'rxjs/operators';
这是我在 package.json 中的 rxjs 版本:
"rxjs": "^6.5.2"
我有一个 Observable ( this.searchResults$
),它发出搜索 API 请求的结果。我现在想再做一次搜索,把新的搜索结果和旧的搜索结果结合起来,全部放在this.searchResults$
. this.handleSearch()
返回带有搜索结果的 observable
我以为我会这样做:
const newSearchResults$ = this.handleSearch(undefined, this.currentPage + x);
merge(newSearchResults$, this.searchResults$).subscribe(x => console.log(x));
但是这个控制台记录:
(10) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
(6) [{…}, {…}, {…}, {…}, {…}, {…}]
控制台日志的第二行需要包含 16 项。相反,它会被新的 6 个项目覆盖。
我在网上查看了为什么合并不合并结果,发现我应该使用combineLatest
:
const newSearchResults$ = this.handleSearch(undefined, this.currentPage + x);
newSearchResults$.subscribe(x => x);
const combinedSearchResults$ = combineLatest(newSearchResults$, this.searchResults$)
.pipe(map(([s1, s2]: Array < any > ) => [...s1, ...s2]));
combinedSearchResults$.subscribe(x => console.log(x));
这根本不会 console.log 任何东西,也没有错误。我究竟做错了什么?
根据 Pavel 的回答,我尝试过:
const newSearchResults$ = this.handleSearch(undefined, this.currentPage + x);
this.searchResults$.pipe(
mergeMap((d1: any) => newSearchResults$.pipe(map(d2 => [...d1, ...d2])))
).subscribe(console.log);
我也无法得到任何东西来 console.log 。
解决方案
如果你不想合并 2 个 observables,你可以使用 mergemap 操作符。尝试这样的事情:
var obs1 = lastData;
var obs2 = newData;
obs1.pipe(
mergeMap(d1 => obs2.pipe(map(d2 => [...d1, ...d2])))
).subscribe(console.log);
其次要注意你是使用冷的还是热的 observable,因为如果你使用冷的,值将不会被保存,并且每次订阅它时都会调用 API。(您可以使用 shareReplay 运算符从冷创建热可观察对象。
或者您可以像在此示例中一样使用 BehaviorSubject: https ://stackblitz.com/edit/angular-dkh5ji
推荐阅读
- f# - 如何在 F# 中显式使用未经检查的算术运算符
- javascript - 无法从命令中找到角色
- xcode - 安装 .ipa 我需要哪个证书
- google-cloud-firestore - NDB 的 Firestore 有无限制?
- javascript - 如何生成带有曲线的地图
- java - sikuli java, second click() 问题等等
- bash - bash 特殊参数的问题
- javascript - 使用 javascript 进行图像模糊检测
- ruby-on-rails - 如何打印一些特征及其特征类型(类别)?
- sql-server - WITH 子句中的 Getdate() 是否应该声明为变量?