Angular RxJS 键盘输入在输入或去抖动时间发出

Question

我有一个搜索输入功能，我希望在用户按下回车键或去抖超时结束时调用该功能。基本上我想将这两条路径组合成一个 RxJS observable：

这将在输入时执行搜索：

<input [formControl]="searchInput" (keydown.enter)="search()">

这会在去抖超时后执行搜索：

searchInput.valueChanges.pipe(debounceTime(500)).subscribe(() => search());

这似乎是一个常见的要求，但我一直无法弄清楚如何防止

debounceTime

的冗余发射。我能做的最好的事情就是记录搜索词并在

debounceTime

触发时忽略发射：

search() {
  if (this.lastUsedSearchTerm != searchInput.value) {
    this.lastUsedSearchTerm = searchInput.value;
    // do search...
  }
}

我想要一个单独的可观察对象并消除

searchTerm

属性。

Answer 1

尝试搜索标志并过滤其上的流。

searching = false;

searchInput.valueChanges.pipe(
  tap(() => { this.searching = false; }),
  debounceTime(500),
  filter(() => !this.searching)
).subscribe(() => search());

search() {
  this.searching = true;
  // rest of search logic
}