javascript - 使用 switchMap 取消订阅先前的 http 请求并仅获取最新的请求

Question

我目前面临一个问题，第一次搜索可能需要 5 秒，第二次搜索需要 2 秒，问题是，第一次搜索需要更长的时间，将“删除”已完成请求的结果之后，因为调用在此之后结束。

我尝试阅读有关

switchMap

在 rxJs 中并尝试使用它，但是根据我的尝试，它不会取消订阅先前的请求并删除结果。

我在这里可能做错了什么，但我无法准确指出问题是什么。

合并的结果有 3 个更改源(分页、排序或新搜索条件)，并且对 sendSearchCriteria 的调用会返回所使用的数据。

sendSearchCriteria 返回一个 Observable

您认为我做错了什么吗？

感谢您的帮助，

private loadDogsResults = (filtersInformation: FilterSearchCriteria) => {
    merge(this.sort.sortChange, this.paginator.page, of(filtersInformation))
      .pipe(
        distinctUntilChanged(),
        tap(() => (this.isLoading = true)),
        switchMap(() => this.sendSearchCriteria(filtersInformation)),
        //mergeMap(() => this.sendSearchCriteria(filtersInformation)),
        map(data => this.formatResults(data)),
        finalize(() => (this.isLoading = false)),
        catchError(error => this.handleError(error)),
        takeUntil(this._onDestroy$)
      )
      .subscribe((result: any[]) => {
        if (result.length > 0) {
          this.setDisplayedColumns(result[0]);
        }
        this.isLoading = false;
      });
  }

Answer 1

哪个事件触发搜索？此事件应该是您的 Observable 的源，它将通过 switchMap 运算符进行“管道传输”。

正如我在这里所看到的，如果您为每个事件调用 loadDogsResults() ，它就不会工作，因为您每次都会创建一个新的 Observable 。 of(filtersInformation) 是一个 Observable，当订阅 observable 时，它​​会发出一次 filtersInformation 值，我不认为这是预期的行为。