RXJS来自解析数据，过滤器数据和无限滚动数据的链式响应

Question

有3种不同的UI / UX元素会影响用户在应用程序中看到的数据。第一个是来自解析器的解析数据。第二个是无限滚动动作产生的串联数据。第三个（过滤器）将整个数据替换为另一组相同类型的数据。

到目前为止，我能够使解析的数据和无限的数据协同工作，以实现流畅的滚动体验。这是我的代码。

this.referrals$是呈现给DOM的Observable流。

//Resolved data from this.activatedRoute.data
const resolvedReferrals$ = this._getResolvedData()
            .pipe(map((response: ReferralSearchResponse ) => response.data));

this.referrals$ = merge(resolvedReferrals$, this._newReferrals$)
         .pipe(tap(console.log), scan((acc, val) => acc.concat(...val), []), tap(console.log));

//infinite scroll action where this._newReferrals$ is a Behavior Subject.
 getMoreReferrals(event: any) {
    this.getReferrals()
        .subscribe((values: ReferralSummary[]) => {
          this._newReferrals$.next(values);
          event.target.complete();
        });
  }

我正在使用同一页面导航来通过解析器获取过滤后的数据。

 this._router.navigate([], { relativeTo: this._activatedRoute, queryParams: this.filterCriteria })

应用过滤器和解析器向我发送新数据时，该数据将追加到列表的末尾，而不是替换列表。我明白为什么这样做了。但是，我不知道如何完全以 RxJS 的方式修复它。