Angular9/rxjs6.5: 如何将一个 Observable 对象数组转换为一个 Observable 对象 属性 数组？

Question

我正在使用 Angular(9) Powered Bootstrap (ng-bootstrap 6.1) 并为 ngbTypeahead 提供 Observable ，如下所示：

search = (text$: Observable<string>) => {
    return text$.pipe(
      debounceTime(200),
      distinctUntilChanged(),
      // switchMap allows returning an observable rather than maps array
      switchMap((searchText) => {
        if (!searchText || searchText.trim().length < 3) {
          // when the user erases the searchText
          return EMPTY;
        } else {
          // get a list of dealer reps
          return this.myService.getKeyValues(searchText);
        }
      })
      , catchError((error) => of(this.myService.postErrorMessage(error)))
    );
  }

我需要通过将每个 IKeyValue 项目映射到其 item.value 属性，将 this.myService.getKeyValues 的输出从 Observable 转换为 Observable。 =13=]

如何修改上面的代码以使用 rxjs 6.5.5 执行此操作？

Answer 1

在 switchMap 之后，你可以放一个 map() 运算符，做你需要的转换和 return 新值。

我想应该是这样的。请注意 return 值中的 map 是不同的值。

search = (text$: Observable<string>) => {
return text$.pipe(
  debounceTime(200),
  distinctUntilChanged(),
  // switchMap allows returning an observable rather than maps array
  switchMap((searchText) => {
    if (!searchText || searchText.trim().length < 3) {
      // when the user erases the searchText
      return EMPTY;
    } else {
      // get a list of dealer reps
      return this.myService.getKeyValues(searchText);
    }
  }),
  map((response: IKeyValue[]) => { //Input parameter is the result from the switchMap
      //I'll do it with a map on the array to retrieve how you want the array by mapping only the property, but you can do in some other way.
      return response.map(item => item.value);
  }),
  catchError((error) => of(this.myService.postErrorMessage(error)))
);

}