Custom Exception Handler in Angular2

Question

In angular2 the exceptions are logged in the console by default. I heard that we can inherit the Angular ExceptionHandler and create our own exception handler so that we can override the default behavior. I tried to do it but didn't work. Can anyone help me on this with an example. Thanks in advance ....

Answer 1

As of version 2.0.1, the current way of creating a custom error handler is the ErrorHandler interface found in @angular/core.

From the docs:

https://angular.io/docs/ts/latest/api/core/index/ErrorHandler-class.html

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

class MyErrorHandler implements ErrorHandler {
  handleError(error) {
    // do something with the exception
  }
}
@NgModule({
  providers: [{ provide: ErrorHandler, useClass: MyErrorHandler }]
})
class MyModule {}

When applying this on the root module, all children modules will receive the same error handler (unless they have another one specified in their provider list).

Answer 2

It looks like you need to create your own class to handle exceptions, and then bind it in your app at bootstrap time, something like this:

import {provide, ExceptionHandler} from '@angular/core';

class MyExceptionHandler implements ExceptionHandler {
    call(error, stackTrace = null, reason = null) {
       // do something with the exception
    }
 }

And then at bootstrap time, bind this new implementation as the ExceptionHandler:

bootstrap(MyApp, 
    [provide(ExceptionHandler, {useClass: MyExceptionHandler})])

See here for reference.

Plunker example