Question

为了学习Angular，我嘲笑了一个做两件事的Web服务：

返回数组的Observable（Observable<T[]>）
将ID标识的项目返回为Observable（Observable<T>）

这就是我的理解：

export class Event {
    constructor(public id: number, public title: string) {}
}

const EVENTS = [
    new Event(1, 'Tooth extraction'),
    new Event(2, 'English lesson'),
    new Event(3, 'Driving lesson'),
    new Event(4, 'Mortgage meeting'),
];

let eventsObservable: Observable<Event[]> = Observable.of(EVENTS);

import { Injectable } from '@angular/core';

@Injectable()
export class EventsService {

    getEvents() {
        return eventsObservable;
    }

    getEvent(id: number|string) {
        return eventsObservable.concatMap((x) => {
           return x;
        }).filter((event: Event) => {
            return id === event.id;
        });
    };
}

我只是从Observable和Angular开始，但是，我不认为getEvent(id: number|string)的实现是最佳的，因为我正在做的事情是：

在Observable<T[]>，
将中的每一个发送为Observable<T>，
然后只过滤发出的项目以找到我正在寻找的项目
将此项目作为Observable返回。

是否有更好，更优的方式只返回Observable<T[]>中的唯一商品？

Answer 1

是否有更好，更优的方式从Observable返回一个唯一的项目？

使用带有observable的map并根据传递给函数的逻辑返回一个新的observable。

getEvent(id: number | string) : Observable<Event> {
    return eventsObservable.map((x:Event[]):Event => {
        return x.find(y => y.id === id);
    });
};

Answer 2

你实际上根本不需要使用RxJS，但我想你正在使用Observables，因为稍后会附加一些其他功能。

我认为唯一可以让它更具可读性的是不使用仅重新提交值的Observable.of()并使用迭代数组的Observable.from()并将每个值作为单独的项发出。

let eventsObservable: Observable<Event> = Observable.from(EVENTS);

...

getEvent(id: number|string) {
    return eventsObservable
      .filter((event: Event) => {
          return id === event.id;
      });
}

最后，如果您需要将事件保存为Observable<Event[]>中的数组，则可以使用concatAll将其展平，这样可以更容易理解。

getEvent(id: number|string) {
    return eventsObservable
      .concatAll()
      .filter((event: Event) => {
          return id === event.id;
      });
};

concatAll()运算符将Observable<Event[]>变为Observable<Event>。

Answer 3

你真正想要的就是这样：

getEvent(id: number|string) {
        return eventsObservable.flatMap((x) => Observable.from(x)).filter((event: Event) => {
            return id === event.id;
        });
    };

但请注意，虽然可以使用.map(array=>array.find(...))作为@Igor建议并且避免对数组进行一次不必要的迭代，但它没有多大意义。

过滤Observable <t []>以获取RxJS中的特定Observable <t>

3 个答案: