异步方法上的 Angular 承诺处理装饰器

问题描述

我的应用程序中有很多地方需要以相同的方式处理失败的异步方法调用：显示烤面包机并在控制台中记录错误。为此，我正在为 Angular 控制器方法编写一个装饰器。假设该方法是一个异步函数，例如：

@ToastOnFail
async makeCall() {
  const result = await this.httpService.makeSomeRequest();
  // do stuff with the result
}

我的装饰器看起来像这样

export default async function ToastOnFail(
  target: any,propertyKey: string,descriptor: PropertyDescriptor
) {
  const originalMethod = descriptor.value;
  descriptor.value = function (...args) {
    const toasterService = AppModule.injector.get<ToasterService>(
      ToasterService as Type<ToasterService>
    );
    return originalMethod.apply(this,args)
      .catch((err) => {
        toasterService.addGenericActionIncompleteError();
        console.error(err);
      });
  };
}

出现编译错误

错误 TS1241：作为表达式调用时，无法解析方法装饰器的签名。 类型 'Promise' 与类型 'TypedPropertyDescriptor Promise>' 没有相同的属性。

我不确定是否是 TS 混淆，我必须进行一些手动转换，或者如果我没有返回我应该从装饰器返回的内容。我错过了什么？

解决方法

免责声明这不是您问题的答案

为什么不使用“自定义运算符”？ here 有一个关于自定义运算符的很好的链接。通过这种方式，您可以对 observable 进行“操作”

有些喜欢

function debug<T>(toasterService:ToasterService) {
  return function<T>(source: Observable<T>): Observable<T> {
    return source.pipe(catchError((err:any)=>{
      toasterService.addGenericActionIncompleteError()
      return throwError(err) //or return of(null)
    }));
  };
}

允许你写

const result = this.httpService.makeSomeRequest().pipe(debug(this.myToaster));