将typescript/javascript承诺到rxjs中

bnl4lu3b 于 2023-03-04 发布在 TypeScript

关注(0)|答案(4)|浏览(134)

我有一些代码如下：

async someFunction(){ 
    ... 
    await apiRequest()
    ...
  }

apiRequest(){
    return new Promise(resolve=>{
      this.httpClient.getAuth('/api')}.subscribe({
        next: res => {
            ...
            resolve(true)
        },
        error: error => { resolve(false) }
      })
    )
  }

这段代码有点难看。有没有其他方法可以不使用promise来同步函数的调用？也许使用rxjs？我只需要知道API调用完成了。

typescript

来源：https://stackoverflow.com/questions/75629455/typescript-javascript-promise-into-rxjs

4条答案

按热度按时间

6ss1mwsb1#

有很多方法，我认为最简单的一个是从RxJS中使用toPromise，但是这个函数从版本7开始就 deprecated 了，新的函数是lastValueFrom，工作原理如下：

async someFunction(){ 
    ... 
  try {
    await data = lastValueFrom(apiRequest())
    console.log(data);
  } catch (err) {
    console.log("ERROR");
  }
    ...
}

apiRequest(){
    return this.httpClient.getAuth('/api');
  }

您现在可以做的是等待“someFunction（）”，如下所示：

async loadAllFunction() {
  await someFunction();
  // All loaded... do what you want.
}

赞(0）回复(0）举报 2023-03-04

kyks70gy2#

async/await使用承诺（一个未来值）
rxjs在订阅多个值时使用观察值
rxjs还使用.pipe()/.switchMap()来管理多个未来值

我猜你正在寻找的是这两种方法，它们给你一个来自可观察的承诺。

import { firstValueFrom, lastValueFrom } from 'rxjs';

赞(0）回复(0）举报 2023-03-04

5jdjgkvh3#

承诺不是Angular 的方式，Angular 是建立在RxJs之上的，所以最好坚持RxJs。apiRequest应该返回可观察的，而不是将其转换为承诺。

apiRequest() {
  return this.httpClient.getAuth('/api').pipe(
    // optional, only if you want service level error handling
    catchError(err => { yourDealWithErrrorFunction(err); })
  );
}

然后你订阅你使用它的地方。

someFunction() {
  apiRequest().subscribe({
    next: res => { doStuffWithRes(res); },
    error: err => { handleError(err); }
  });
}

或者我们使用异步管道来管理组件中的订阅

apiData$ = this.service.apiRequest(); // optionally use a catchError if you want

在模板中

<ng-template *ngIf="apiData$ | async as apiData">
  apiData is: {{ apiData | json }}
</ng-template>

这是最常见的Angular 模式。不推荐使用promise和async/waits。学习RxJs，它会让你成为一个更好的Angular 开发者。将一个可观察到的转换为promise会剥夺它的RxJs超级能力。RxJs操作符允许你从可观察到的构建流，比如组合和Map流。这是一种方法，一旦点击了promise，你就不会回头看它，即使它一开始有点让人不知所措。

赞(0）回复(0）举报 2023-03-04

eqoofvh94#

rxJS对此-https://www.learnrxjs.io/learn-rxjs/operators/creation/from有一个from运算符

赞(0）回复(0）举报 2023-03-04