Question

我正在使用ngbootstrap typeahead（https://ng-bootstrap.github.io/#/components/typeahead/examples#http）

根据上述示例，我们需要将可观察到的返回给[ngbTypeahead]="search"

我们期望API产生以下结果

{ "data": { "groupNames": [ "group level one", "group level two", "group level one", "group level two" ] } }

从此返回结果中，我们需要通过包含单词进行过滤。

search = (text$: Observable<string>) => text$.pipe( debounceTime(300), distinctUntilChanged(), map((term) => term.length < 1 ? [] : this.productService.getGroups().subscribe((response) => { if (response && response.data) { return response.data.groupNames.filter((response) => response.toLowerCase().indexOf(term.toLowerCase()) > -1); } }, ), ), )

问题：

我如何返回下面的结果作为Typahead属性的观察结果

return response.data.groupNames.filter((response) => response.toLowerCase().indexOf(term.toLowerCase()) > -1);

（注意-我们正在从服务中获取整个数据，并从结果中获取按用户类型分类的结果）

Answer 1

从订阅回调中返回几乎没有任何意义。您可以尝试用switchMap替换subscription并从流中返回事件，而不是尝试返回subscription中的事件。我猜工作示例如下：

search = (text$: Observable<string>) =>
    text$.pipe(
      debounceTime(300),
      distinctUntilChanged(),
      switchMap((term) => term.length < 1 ? of([]) :
        this.productService.getGroups().pipe(
          filter((response) => response && response.data)
          map((response) => response.data.groupNames.filter((response) => response.toLowerCase().indexOf(term.toLowerCase()) > -1))
        )
      ),
    )

在Typeahead中，无法订阅服务以获取数据以绑定到typeahead搜索

1 个答案: