Angular instanceof对于子类返回false

我正在尝试为我的应用程序创建错误处理。我已经创建了一个名为AppError的基类。我有扩展AppError类的特定错误类。例如，错误状态为400的BadInput类。我使用instanceof来识别对象的类别。但是，即使我正在创建BadInput类的实例，BadInput的obj instanceof总是返回false。我的代码如下：

import { ErrorHandler } from '@angular/core';

export class AppErrorHandler implements ErrorHandler {
    handleError(error: any): void {
        console.log(error);
        alert ('Sorry. An unexpected error occured. Our engineers are fixing it.');
    }
}

应用程序错误。ts

输入错误。ts

数据服务.service.ts

请注意行return Observable.throw（新的BadInput（error.json（））在handleError（）中多次

otp.service.ts

otp.component.ts

为了简洁起见，我跳过了一些代码，但是如果您需要，我可以把代码放在这里

更新1:

我修改了otp.component.ts中的submit（），以查看全局错误处理程序是否与此相关。更新的提交方法如下所示：

submit() {
    const body = {
      UserId: this._user.id,
      OTP: this.otp.value
    };

    this._spinner.show ();

    this._otpCheckerService.check(body).subscribe(
      response => {
        this._user.isSignedIn = true;
        this._router.navigate(['/checkout']);
      },
      (error: AppError) => {
        this._spinner.hide();
        if (error instanceof BadInput) {
          console.log ('handling bad input..');
          this._isOtpWrong = true;
        } else if (error instanceof AppError) {
          console.log ('handling app error..');
        } else {
          throw error;
        }
      },
      () => {
        this._spinner.hide();
      }
    );
  }

请注意，我正在检查AppError的错误实例。这也返回false。全局错误处理程序处理错误。我的全局错误处理程序如下所示：

import { ErrorHandler } from '@angular/core';

export class AppErrorHandler implements ErrorHandler {
    handleError(error: any): void {
        console.log(error);
        alert ('Sorry. An unexpected error occured. Our engineers are fixing it.');
    }
}

---

给你。显然，您得到的不是JSON（至少在出现错误时是这样），因此，调用

error.JSON（）

时，您的

handleError

方法会抛出异常。该异常（一个

错误

对象）是您在订阅中得到的，而不是您的

错误

类

我建议这样做：

protected handleError(error: Response) {
    try {
        if (error.status === 400) {
            return Observable.throw (new BadInput (error.json()));
        } else if (error.status === 404) {
            return Observable.throw (new NotFoundError ());
        } else if (error.status === 500) {
            console.log ('in 500 handling...');
            return Observable.throw (new BadInput (error.json()));
        }

        return Observable.throw (new AppError (error.json()));
    } catch (err) {
        return Observable.throw(new AppError({
           message: err.message,
           stackTrace: err.stack
        }
    }
}

---

通过这种方式，您可以捕获任何异常，并接收您的一个类（如果您需要的话）。在任何情况下，现在您都知道了类型检查失败的原因。

我建议您在

subscribe

方法的错误处理程序中执行

console.log（error）

，以查看收到的内容。然后你可以发布，我们会see@OscarPaz我已经在做了。你会在我的更新中看到这一点。但据我所知，这并不相关。问题是，为什么instanceof对于AppError和BadInput都返回false？代码清楚地返回了BadInput错误对象。不，您正在记录一条文本消息，而不是error的值。在进行类型检查之前（就在

this.\u spinner.hide（）

之前）记录这些信息。我认为，由于某种原因，

错误

不是你想象的那样。通过这种方式，控制台将告诉您它是什么类型的对象，并提示我们如何解决该问题issue@OscarPaz抓住你了。我把错误打印出来了。我得到了“SyntaxError:Unexpected token<在JSON中的位置0”。顺便说一句，我正在执行数据服务handleError（），因为我得到了相关的控制台日志。我必须为我的错误处理做错误处理。哈哈哈。谢谢

// Only providing required code

submit() {
    const body = {
      UserId: this._user.id,
      OTP: this.otp.value
    };

    this._spinner.show ();

    this._otpCheckerService.check(body).subscribe(
      response => {
        this._user.isSignedIn = true;
        this._router.navigate(['/checkout']);
      },
      (error: AppError) => {
        this._spinner.hide();
        if (error instanceof BadInput) {
          console.log ('handling bad input..');
          this._isOtpWrong = true;
        } else {
          throw error;
        }
      },
      () => {
        this._spinner.hide();
      }
    );
  }

submit() {
    const body = {
      UserId: this._user.id,
      OTP: this.otp.value
    };

    this._spinner.show ();

    this._otpCheckerService.check(body).subscribe(
      response => {
        this._user.isSignedIn = true;
        this._router.navigate(['/checkout']);
      },
      (error: AppError) => {
        this._spinner.hide();
        if (error instanceof BadInput) {
          console.log ('handling bad input..');
          this._isOtpWrong = true;
        } else if (error instanceof AppError) {
          console.log ('handling app error..');
        } else {
          throw error;
        }
      },
      () => {
        this._spinner.hide();
      }
    );
  }

import { ErrorHandler } from '@angular/core';

export class AppErrorHandler implements ErrorHandler {
    handleError(error: any): void {
        console.log(error);
        alert ('Sorry. An unexpected error occured. Our engineers are fixing it.');
    }
}

protected handleError(error: Response) {
    try {
        if (error.status === 400) {
            return Observable.throw (new BadInput (error.json()));
        } else if (error.status === 404) {
            return Observable.throw (new NotFoundError ());
        } else if (error.status === 500) {
            console.log ('in 500 handling...');
            return Observable.throw (new BadInput (error.json()));
        }

        return Observable.throw (new AppError (error.json()));
    } catch (err) {
        return Observable.throw(new AppError({
           message: err.message,
           stackTrace: err.stack
        }
    }
}