Angular: Custom Error Handling

One of the main things I think about when I’m building a application is how to handle the potential errors that eventually prop up. I love angular, writing a custom error handler service is extremely easy.

Step 1

You can create the new service by right clicking in the app root to create new file.

(I prefer this way) Go into your terminal, type ng generate service “service/error-handler” I like to keep all my services, components and pipes in there own separate folders but it is totally up to you.

Now that that the error handler service is created its time to overwrite the default handler with our custom one.

custom error service file

Step 2

Make sure to go over to app.module.ts and add the import for the service and add it under the providers in NgModule.

error import

error provider

After all that you now have a working custom error handler that is easily intigrated into any angular project with or without the angular-cli.

Custom Error Handler Message

custom error message