Question

我使用主题和异步管道发出http请求并根据搜索词进行搜索。为此，我使用了角度教程，该教程使用了 switchmap 运算符和 keyup 方法的一些延迟时间。

对于击键来说效果很好，但是第一次我想拨打请求电话并显示列表，然后用户可以搜索她是否想要。

但是调用 next 后， switchmap 运算符不会触发！

搜索输入：

<input type="text" placeholder="Search name" [(ngModel)]="searchTerm" (keyup)="callSearch()">

打字稿代码：

 products$: Observable<ProdSearch[]>;
 searchProducts$ = new Subject<string>();
 callSearch() {
   if (this.searchTerm.length > 0 ){
    this.searchProducts$.next(this.searchTerm);
   }
 }

this.products$ = this.searchProducts$.pipe(
  debounceTime(1000),
  distinctUntilChanged(),
  switchMap(term => {
    const options: PagingOptions = {};
    options.limit = "5";
    if (term.length !== 0) {
      options.filterOptions = "name_search_" + this.searchTerm;
    }

    return this.service.getCollection<ProdSearch>(this.baseUrl + 'products/search', options)
      .pipe(map(collection => collection.records))
  })

我想用一个按钮第一次运行 switchmap ，但是它不起作用，并且只对按键起作用。

showLastProducts() {
this.showChangeList = true;
this.searchProducts$.next(''); // The switchmap won't work
}

Answer 1

尝试切换：

searchProducts$ = new Subject<string>();

对此：

searchProducts$ = new BehaviorSubject<string>('');

这将在您键入任何内容之前发出一个值。

下次调用时运行switchmap运算符-Angular 7

1 个答案: