中止先前对异步 ngx-typeahead 发出的请求

Question

如果我在组件中使用如下 ngx-typeahead 指令

<input type="search"
  [(ngModel)]="asyncSelected"
  [typeahead]="dataSource"
  (typeaheadLoading)="changeTypeaheadLoading($event)"
  (typeaheadNoResults)="changeTypeaheadNoResults($event)"
  (typeaheadOnSelect)="typeaheadOnSelect($event)"
  [typeaheadWaitMs]="200"
  [typeaheadMinLength]="2"
  [typeaheadOptionsInScrollableView]="10"
  [typeaheadSingleWords]="false"
  [typeaheadScrollable]="true"
  [typeaheadItemTemplate]="someTemplate"
/>

在组件的构造函数中启动 dataSource :

this.dataSource = Observable.create((observer: any) => {
    observer.next(this.asyncSelected);
}).mergeMap((token: string) => {
    return this.http.post<DevisResponses>('http://example.com/api',token);
});

当我在 <input/> 中写一些字母时 请求 A 将在 200Ms 之后发出，但是 如果我在通话结束前快速输入另一个字母，那么我将有一个新的请求B，结果与来自请求 A !

似乎 [typeaheadWaitMs] 是唯一可用于阻止请求的参数，但是 我可以中止之前发出但未完成的请求吗？

Answer 1

所以，作为 @Daniel B and @Alexander Poshtaruk pointed in their comments, I had to import the swithMap operator and use it instead of mergeMap because, as stated in the doc :

When a new inner Observable is emitted, switchMap stops emitting items from the earlier-emitted inner Observable and begins emitting items from the new one.

所以在 import { switchMap } from 'rxjs/operators'; 之后，我现在如何启动 dataSource：

this.dataSource = Observable.create((observer: any) => {
    observer.next(this.asyncSelected);
}).mergeMap((token: string) => {
    return this.http.post<DevisResponses>('http://example.com/api',token);
});

但是，我仍然不明白为什么我不能使用 .switchMap 作为创建的 Observable 的方法（如 the doc 示例中所写）

中止先前对异步 ngx-typeahead 发出的请求

Abort previously made request on async ngx-typeahead

angular

asynchronous

typeahead

bootstrap-typeahead

ngx-bootstrap