angular - 从可观察数组中获取一个对象

标签 angular rxjs observable

如何编写一个接受 Observable<T[]> 的函数?并返回 Observable<T>

比如我有两个方法:

getTransactions(): Observable<Transaction[]>{
        ...
    }
getTransaction(id: number): Observable<Transaction>{
    return this.getTransactions().pipe(find(txn => txn.id === id));
}

我收到错误消息,类型“Observable”不可分配给类型“Observable”。类型“Transaction[] 不可分配给类型“Transaction”。 “Transaction[]”类型中缺少属性“id”。

据我所知,可观察管道函数(map、single、find、max 等)属于数据流(即,当可观察对象随时间发出多个项目时)并且在可观察对象发出时没有用一次单个项目(恰好是一个数组)。

getTransaction(id) 的正确方法是什么?功能?我试过:

let transactions : Transaction[] = [];
this.getTransactions().subscribe(txns => transactions=txns);
return of(transactions.find(txn => txn.id === id));

但这会导致错误提示“交易”未定义。我对 Angular 等很陌生,所以任何说明都有帮助。谢谢!

Stackblitz

我正在使用:
Angular CLI:6.0.3
Angular :6.0.1
rxjs: 6.1.0

最佳答案

您需要将可观察值视为数组流,而不是试图将其视为项目流。可观察对象中的值是单点数据,每个数据点都包含自己的数组。

getTransaction(id: number): Observable<Transaction>{
    return this.getTransactions().pipe(
        map(txs => txs.find(txn => txn.id === id))
    );
}

您在这里所做的是将流中的每个数组映射到具有与参数匹配的 ID 的任何项目。

关于angular - 从可观察数组中获取一个对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50454205/

相关文章:

javascript - Ionic2、Angular2、HTTP 和 Observables

Angular 6 元素 bool 输入参数

lazyUpdate 中的 Angular HttpClient 补丁 header

javascript - 为什么我不能将 .map() 函数链接到可观察对象上

javascript - 对主题使用 mergeMap() 会忽略我正在合并的可观察对象上的 takeWhile()

javascript - 使用 RxJS 可观察对象时数据的 I/O 关系

angular - 使用 RXJS 继续以 Angular 触发 http 调用,直到满足条件

Angular 2+ 仅在变化时订阅 observable

angular - 如何使用 switchMap 取消挂起的 http 请求并只接受最后一次订阅?

angular - 如何配置 `ng serve` 以捕获 dockersized Angular 2 应用程序中的更改?