Angular 4,自定义ErrorHandler无法识别自定义错误

前端之家收集整理的这篇文章主要介绍了Angular 4,自定义ErrorHandler无法识别自定义错误前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我尝试创建自定义全局 ErrorHandler并遵循详细说明 here

应用程序错误处理程序(只是重要的部分)

@Injectable()
export class ApplicationErrorHandler extends ErrorHandler {

    constructor(private injector: Injector) {
        super(false);
    }

    handleError(error: any): void {

        if (error instanceof ApplicationError || error.originalError instanceof ApplicationError) {
            this.addError(error.originalError);
        }
        else {
            super.handleError(error);
        }
    }

应用模块

providers: [
    {
        provide: ErrorHandler,useClass: ApplicationErrorHandler
    }
],

app.component(只有重要部分)

public ngOnInit(): void { 
    const error = new ApplicationError();
    error.message = "fehler";
    throw error;
}

应用程序错误

export class ApplicationError implements Error {
    name: string;
    message: string;
    httpStatus?: number = 404;
    applicationStatus?: number;
    errorMessageTranslationkey: string;
    handled: boolean = false;
}

在我的app.component中我抛出一个ApplicationError(在ngOnInit中),我的ErrorHandler被成功调用.
但是我在handleError中的错误总是类型为Error并且error.originalError始终是未定义的,无论我是否抛出自定义错误,if if将永远不会解析为true.

我不知道为什么以及如何发生这种情况.
我看到错误得到了,所以我假设,包装因为我调试时看到错误错误:[object:Object] at viewWrappedDebugError(vendor.bundle.js)

知道什么可能导致这个问题以及我如何解决它?

编辑
怀疑它与Debugmode有关.只要我使用enableProdMode()启用prodmode;它按预期工作.

这仍然没有真正回答我的问题.

如何在angular的调试模式下处理自定义错误

您遇到此问题,因为ApplicationError不是错误.

您可以使用以下代码来创建自定义错误

export class ApplicationError extends Error {

  httpStatus?: number = 404;
  applicationStatus?: number;
  errorMessageTranslationkey: string;
  handled: boolean = false;

  constructor(message?: string) {
    super(message);
    this.name = ApplicationError.name;
    Object.setPrototypeOf(this,ApplicationError.prototype);
  }
}

与创建自定义错误主题相关,还要检查这些链接,以便对主题有完整的了解:

> extending Error,Array,Map in TypeScript引用here
> Error – Custom Error Types section

为什么这需要成为错误的实例?
因为您的错误通过以下方法

function viewWrappedDebugError(err,context) {
    if (!(err instanceof Error)) {
        // errors that are not Error instances don't have a stack,// so it is ok to wrap them into a new Error object...
        err = new Error(err.toString());
    }
    _addDebugContext(err,context);
    return err;
}

代码可在errors.ts获得.

因此,如果您没有抛出Error实例,则会创建一个新实例.

在ErrorHandler中拦截未捕获的promise

另一个错误情况是从Angular生命周期调用方法返回一个被拒绝的promise(例如:handler,lifecycle-hook).

export class AppComponent implements OnInit {

  ngOnInit() {
    return new Promise((resolve,reject) => reject(new ApplicationError()));
  }
}

因此,错误处理代码可能如下所示:

import {ErrorHandler,Injectable,Injector} from "@angular/core";
import {ApplicationError} from "./ApplicationError";

@Injectable()
export class ApplicationErrorHandler extends ErrorHandler {

  private errors: ApplicationError[] = [];

  constructor(private injector: Injector) {
    super(false);
  }

  handleError(error: any): void {

    if (error instanceof ApplicationError) {
      this.addError(error);
    }
    else {
      if(error.rejection instanceof ApplicationError) {
        this.addError(error.rejection);
      }
      else {
        super.handleError(error);
      }
    }
  }

  addError(error: ApplicationError) {
    this.errors.push(error);
  }
}

猜你在找的Angularjs相关文章