angular - Linq First相当于TypeScript+rxjs

Question

我熟悉 C# Linq，但对 ng2+TypeScript+rxjs 开发不熟悉。

在下面代码的getDetailByDetailId方法中，如何从可观察列表中获取First匹配项？

模型

export class Master {
    Id: string;
    SomeProperty: string;
    Details: Detail[];
}    

export class Detail {
    DetailId: string;
    DetailProperty: string;
}

方法

getMaster(id:string): Observable<Master>{
    return this.http.get(this.webUrl + "/" + id) // web api
        .map(this.extractData)
        .catch(this.handleError);
}

private extractData(res: Response) {
    let body = res.json() as Master[];
    return body || [];
}

getDetails(masterId: string): Observable<Detail[]>{
    return this.getMaster(masterId)
        .map(master => master.Details);
}

getDetailByDetailId(masterId: string, detailId: string): Observable<Detail>{
    return this.getDetails(masterId)
        .first(d => d.DetailId === detailId); // <-- Error occurred
}

getDetailByDetailId 方法给出以下两个错误。

Error:(47, 16) TS2322: Type 'Observable<Detail[]>' is not assignable to type 'Observable<Detail>'. Type 'Detail[]' is not assignable to type 'Detail'. Property 'DetailId ' is missing in type 'Detail[]'.

Error:(48, 45) TS2339: Property 'DetailId' does not exist on type 'Detail[]'.

Answer 1

问题是 getDetails返回Observable<Detail[]> 。因此，值被发送到 first方法是Detail[] ，没有一个Detail 。您可以做的就是首先使用 flatMap 展平数组，然后您可以调用first

getDetailByDetailId(masterId: string, detailId: string): Observable<Detail> {
  return this.getDetails(masterId)
    .flatMap(details => details)
    .first((d: Detail) => d.DetailId === detailId);
}