RxJS 6 获取 Observable 数组的过滤列表

Question

在我的 ThreadService 类中，我有一个函数 getThreads() 返回一个 Observable<Thread[]> 以及我的所有线程。

现在，我想要我的函数的另一个版本，我的线程被选定的主题过滤：函数 getSelectedThemeThreads(theme: Theme) 。

我尝试使用运算符 map 和 filter 但我收到以下错误消息 Property 'theme' does not exist on type 'Thread[] 。

在我正在处理的代码下面：

 import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable, of } from 'rxjs';
import { catchError } from 'rxjs/operators';
import { Thread } from '../models/thread.model';
import { Theme } from '../models/theme.model';

@Injectable({
  providedIn: 'root'
})
export class ThreadService {
  private threadsUrl = 'api/threads';

constructor(private http: HttpClient) { }

getThreads(): Observable<Thread[]> {
  return this.http.get<Thread[]>(this.threadsUrl);
}

getSelectedThemeThreads(): Observable<Thread[]> {
  return this.http.get<Thread[]>(this.threadsUrl).pipe(
    map(threads => threads),
    filter(thread => thread.theme.id === theme.id)
  );
}

在此先感谢您的帮助。

原文由 Johan Rin 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

我做了这个 StackBlitz / angular6-filter-result 的例子

主要思想是在 map() 中进行过滤，因为过滤器将获得一个对象数组。

 getSelectedThemeThreads(theme: string): Observable<Flower[]> {
    return this.http.get<Flower[]>(this.threadsUrl).pipe(
      map(result =>
        result.filter(one => one.theme === theme)
      )
    )
  }

原文由 hamilton.lima 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

你快到了。使用这个 map(threads => threads) 什么都不做，但你可能想改用这个：

 mergeMap(threads => threads) // will turn Observable<Thread[]> into Observable<Thread>

concatMap 或 switchMap 也可以。 mergeMap 运算符将迭代数组并分别发出每个项目，这样您就可以使用 filter() 就像您已经在做的那样。

你当然也可以使用这个：

 map(threads => threads.find(thread => thread.theme.id === theme.id)),
filter(thread => thread !== undefined),

原文由 martin 发布，翻译遵循 CC BY-SA 4.0 许可协议