如何将可观察的 http 请求更改为承诺请求

问题描述 投票:0回答:2

这是我的服务档案 这是我的组件 ts 文件 这些是响应模型

由于组件的异步特性,我在显示通过组件的 TypeScript 文件中基于 Observable 的服务获取的数据时遇到了问题。据我所知,我需要将我的服务转换为基于 Promise 的结构,但我在实现 Observable 在基于 Promise 的结构中提供的 responseModel 时遇到了麻烦。我将不胜感激你的帮助。 这些是输出

angular typescript async-await promise angular-promise
2个回答
0
投票

Observables 有一个

.toPromise()
方法

const response = await this.currencyService.getAllByDate(...).toPromise()

编辑 您的调用堆栈也需要一直异步

async ngOnInit(): Promise<void> {
    await this.getAllByDate();
    ...
}

async getAllByDate() {
    let date;
    if (this.selectedDate == null) {
        date = new Date(Date.now()).setHours(3,0,0,0);
    } else {
        date = new Date(this.selectedDate).setHours(3,0,0,0);
    }

    const response = await this.currencyService.getAllByDate(new Date(date)).toPromise();

    if (response && isArray(response.data)) {
        this.currencies = response.data;
        this.currencies.push(newCurrency);
    }
}


0
投票

如果您使用的是 RxJS 7.8.0,我建议您使用 lastValueFrom

例子:

import { HttpClient } from '@angular/common/http';
import { lastValueFrom, take } from 'rxjs';

class YourService {

  constructor(
    private readonly httpClient: HttpClient,
  ) {}

  async yourFunction(): Promise<YourTypeOrInterface> {
    const request$ = this.httpClient.get(yourUrl).pipe(take(1));

    return await lastValueFrom<YourTypeOrInterface>(request$);
  }

}

.toPromise()
已弃用,将在 RxJS 8 中完全删除。

© www.soinside.com 2019 - 2024. All rights reserved.