Angular 2 转换为 Promise

Question

我想从 API 中获取数据，这非常有用，但我正在努力通过 "Observable".

中的给定 ID 过滤单个报告

以下是一些片段：

getAllReports(): Observable<Report[]> {
    return this.http.get(this.reportUrl)
        .map(res => res.json().results);
}

getReports(): void {
    this.reportService.getAllReports()
        .subscribe(
            reports => this.reports = reports,
            error => console.log(error)
        );
}

getSingleReport(id: number): Promise<Report> {
    return this.getAllReports()
        .then(reports => reports.find(report => report.id === id));
        // ^ "Property 'then' does not exist on type 'Observable<Report[]>'"
}

getSingleReport1(id: number): Promise<Report> {
    this.getAllReports()
        .subscribe(
            reports => this.reports = reports,
            error => console.log(error)
        );
    return this.reports.find(report => report.id === id);
    // ^ "Type 'Report' is not assignable to type 'Promise<Report>'"
}

getAllReports()负责与API的沟通并且 return 是一个 Ovserable
getReports() 将 API 调用的结果插入 reports: Report[] 数组
getSingleReport() 应该 return 一个 Promise<Report> 与给定的 Observable<Report[]>
getSingleReport1() 是我第一次尝试解决这个问题，不幸的是它也不起作用

我当然知道3和4的问题出在哪里，但不知道如何解决。

我怎样才能完成从 Report 或 Observable<Report[]> 到 Promise<Report> 的对话。

非常感谢任何帮助。

谢谢。

Answer 1

像这样使用 toPromise 运算符：

getSingleReport(id: number): Promise<Report> {
    return this.getAllReports()
        .subscribe(reports => reports.find(report => report.id === id)).toPromise();
}

Answer 2

所以我仍然没有找到解决方案，但我想出了一个解决方法，我会 post 在这里。我将 getSingleReport(id: number): Promise<Report> 更改为 getSingleReport(id: number): Report。

getSingleReport(id: number): Report {
    this.getAllReports()
        .subscribe(
            reports => this.reports = reports,
            error => console.log(error)
        );
    return this.reports.find(report => report.id === id);
}

这有效，但仍然抛出错误 TypeError: Cannot read property 'find' of undefined。我可能会在今天晚些时候修复它。

更新：

我现在已经完美地工作了，但我决定在没有承诺的情况下去做。

report-detail.component.ts:
getReport(id: number) {
    this.reportService.getSingleReport(id)
        .subscribe(
            report => this.report = report,
            error => console.log(error)
        );
}

report.service.ts:
getSingleReport(id: number): Observable<Report> {
    const apiUrl = 'http://localhost:8080/Berichtsprogramm-API/getReport?api_key={TEMPORARY_APIKEY}&id=' + id;
    return this.http.get(apiUrl)
            .map(res => res.json());
}

这适用于我的情况，我终于可以再次开心了。

Angular 2 转换为 Promise

Angular 2 converting to Promise

type-conversion

typescript

angular-promise

angular2-observables

angular