Rxjs - 组合 2 个可观察量并发出组合结果不起作用



首先,这是我对 rxjs 的导入语句:

import { Subject, Observable, merge, combineLatest } from "rxjs";
import { map } from 'rxjs/operators';

这是我在package.json中的rxjs版本:"rxjs": "^6.5.2"

我有一个可观察(this.searchResults$(,它发出搜索API请求的结果。我现在想再做一次搜索,并将新的搜索结果与旧的搜索结果结合起来,并将它们全部放在this.searchResults$中。this.handleSearch()返回包含搜索结果的可观察量

我想我会这样做:

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));

这根本不会.log任何东西,也没有错误。我做错了什么?

根据帕维尔的回答,我尝试了:

const newSearchResults$ = this.handleSearch(undefined, this.currentPage + x);
this.searchResults$.pipe(
mergeMap((d1: any) => newSearchResults$.pipe(map(d2 => [...d1, ...d2])))
).subscribe(console.log);

我也没有什么可以安慰的.log

如果您不想合并 2 个可观察量,您可以使用 mergemap 运算符。 尝试这样的事情:

var obs1 = lastData;
var obs2 = newData;
obs1.pipe(
mergeMap(d1 => obs2.pipe(map(d2 => [...d1, ...d2])))
).subscribe(console.log);

其次,请注意是使用冷可观察还是热可观察,因为如果您使用冷值,则不会保存该值,并且每次订阅时都会调用 API。(您可以使用 shareReplay 运算符从冷创建热可观察。

或者,您可以使用 BehaviorSubject,如以下示例所示: https://stackblitz.com/edit/angular-dkh5ji

最新更新