来自此 Angular 调用外部 API 服务方法的 Promise return 有多正确？

Question

我正在处理 Angular 应用程序，我发现了以下问题。我有这个服务方式：

  // MANUALLY VERIFY\UNVERIFY EMAIL ADDRESS FOR USER REGISTRATION:
  verifyUnverifyEmailAddress(uid:String): Promise<any[]> {
    this.apiCallUrl = this.apiBaseUrl + "/verifyUnverifyEmailAddress?uid=" + uid;

    //let finalResult = null;

    this.http.get<any>(this.apiCallUrl).subscribe((result) => {
      console.log("VERIFY\UNVERIFY USER EMAIL: ", result);
      return result.toPromise();
    });
  }

问题是我正在尝试 return 我在 subscribe() 箭头函数中的 Promise（因为我必须确保 return 之后我实际上已经检索了我的数据。但是这样做我得到以下错误：

ERROR in src/app/auth/auth.service.ts:237:43 - error TS2355: A function whose declared type is neither 'void' nor 'any' must return a value.

237   verifyUnverifyEmailAddress(uid:String): Promise<any[]> {

在 API 从后端获取数据后，如何重组我的代码以正确 return 我的 Promise？

另一个疑问是：我必须使用这个承诺来更新组件的状态（输入到我的组件中的值 return 用于说明特定用户的电子邮件地址是否经过验证).我有以下疑问：对于这样的用例，return 并使用 Promise 还是 return Obserable 更好？

Answer 1

除非明确要求，否则将 observable 转换为 promise 没有明显的优势。例如。一些 API 期待一个承诺而不是一个可观察的。在所有其他情况下，我认为最好按原样使用 observable。

您可以 return 从服务中观察到并在控制器中订阅

服务

verifyUnverifyEmailAddress(uid:String): Observable<any> { // <-- return observable
  this.apiCallUrl = this.apiBaseUrl + "/verifyUnverifyEmailAddress?uid=" + uid;
  return this.http.get<any>(this.apiCallUrl);
}

然后您可以在组件中订阅

组件

someFunc()
  this.someService.verifyUnverifyEmailAddress('sample').subscribe({
    next: (response) => {
      console.log(response);
      this.response = response;
      // use `response`
    },
    error: (error) => {
      // handle HTTP errors
    }
  });
}

如果出于任何原因你希望转换为 Promise，你可以使用 RxJS lastValueFrom 或 firstValueFrom 函数

组件

import { lastValueFrom } from 'rxjs';

async someFunc()
  this.response = await lastValueFrom(this.someService.verifyUnverifyEmailAddress('sample'));
  ...
}

^{注意：toPromise 在 RxJS 7 中被弃用，将在 RxJS 8 中消失。}

来自此 Angular 调用外部 API 服务方法的 Promise return 有多正确？

How correctly return a Promise from this Angular service method calling an external API?

rxjs

angular-promise

angular

angular-observable