Angular RxJS：仅在Offset更新时用Scan合并HTTP请求结果

要实现仅在offset更新时合并结果、搜索参数（ParamMap）变化时重置累积的需求，核心思路是把搜索参数作为流的触发源，每次搜索参数变化时，重新创建一个独立的加载流，在这个流内部用scan处理加载更多的合并逻辑。这样新的搜索会从头开始累积结果，不会和之前的搜索结果混在一起。

修改后的代码如下：

public getProductsV3(paramMap: Observable<ParamMap>): Observable<ProductResponseApi> {
  return paramMap.pipe(
    switchMap((currentParam) => {
      // 每次搜索参数变更，重新生成加载流
      return combineLatest([this.offset$, this.limit$]).pipe(
        switchMap(([offset, limit]) => 
          this.fetchProductsFromApiV2(offset, limit, currentParam.get('q') as string)
        ),
        // 仅在当前搜索会话内，累积offset加载的结果
        scan((prevResult, currentResponse) => ({
          infos: currentResponse.infos,
          products: [...prevResult.products, ...currentResponse.products]
        }), { infos: null, products: [] } as ProductResponseApi)
      );
    })
  );
}

逻辑说明 #

• 当paramMap（搜索关键词）变化时，switchMap会取消之前的加载流，创建全新的流分支，之前累积的结果会被丢弃。
• 新的分支内，combineLatest([this.offset$, this.limit$])会监听分页参数变化，发起API请求。
• 分支内部的scan只负责当前搜索会话的结果合并：首次加载时用空数组作为初始值，后续offset更新时，将新结果追加到之前的累积数组中。

这样就实现了：

• 搜索新关键词：重置结果，只显示当前搜索的内容
• 点击加载更多（offset更新）：合并当前搜索下的新老结果

内容的提问来源于stack exchange，提问作者mbagiella