5

I am making use of the ErrorHandler in Angular. It works fine if i am working with only one module. When i am using multiple modules and want to use different error handlers in a specific child module, it does not work. Only the parent error handler is invoked.

RootModule
|--> provides CustomErrorHandler1
|    
|--> ChildModule1
|    |--> provides CustomErrorHandler2
|
|--> ChildModule2
     |--> provides CustomErrorHandler1

If an error occures in ChildModule1 or ChildModule2 the error is always handled by the CustomErrorHandler1 instance of RootModule.

I am using lazy-loading to load those modules. Providing different instances of the same service works for all @Injectable()s except for the error handler.

Is it possible to provide those ErrorHandlers so that the errors in each module will be handled by the ErrorHandler provided in their module definition?

I created a sample repository at github. It can be run via ng serve. If you click on "child1" an error is thrown by Childmodule1 and if you click on "child2" an error is thrown by Childmodule2.

6
  • Can you post code of all 3 modules? Commented Feb 10, 2018 at 20:53
  • I added a sample repository. Commented Feb 13, 2018 at 9:05
  • I think when you define an error handler inside of your root module, it will override all other error handlers in it's children, try removing your handler on app.module.ts and just extend from ErrorHandler from inside of your children Commented Feb 13, 2018 at 9:16
  • I made a branch with your suggestions. github.com/karsunke/angular-error-handler/tree/nikola_gavric If you remove the root error-handler, there is no error handling at all. Commented Feb 13, 2018 at 10:44
  • I'll clone the repo now Commented Feb 13, 2018 at 10:55

3 Answers 3

3

After some research I found out that

ErrorHandler => Provides a hook for centralized exception handling.

So I registered only 1 ErrorHandler which intercepts all Exceptions then I've delegated the error to the component based ErrorHandlers and handled the data inside of them. Every child component will have it's own Error and based on instanceof we are delegating error to the appropriate ErrorHandler inside of the component.

Note: The downside of this is that any Error that passes error instanceof Error check will be delegated to the Global registered handler aka one inside of app.module.ts

Also I know that this approach might not be the best, but there isn't a possibility of registering multiple ErrorHandlers that are per component but rather one Global one and then handling everything inside of it. Hope that this can help you resolve the issue in a proper way.

Also I've updated the nikola_gavric branch so you can see what I did there

Sign up to request clarification or add additional context in comments.

Comments

3

The answer is, that ErrorHandling just works for RootModules and the Angular Team is not planning to change that:

https://github.com/angular/angular/issues/22197

1 Comment

They didn’t exactly say that. Someone posted a question that wasn’t really a big report and the issue was closed after someone else tried to help them. There’s no discussion of a feature request nature here.
0

Could you share the code from the Modules???

From what you point it doesn't make any sense since Angular when routes are lazyLoaded, creates a hierarchy of injectors in compilation. That should create the effect that your are looking for.

My suggestions are:

  • Check that your Modules are really been LazyLoaded. The result you are getting is consistent with an eagerLoaded App.
  • Check that your provide token is correct for example you should be doing:
    { provide: ErrorHandler, useClass: CustomErrorHandlerX }

3 Comments

I can assure that they are lazy loaded and that they are provided in the same way. All Services have their own instances in their corresponding modules. Only the error handling does not work.
Did you check that you are using the { provide: ErrorHandler, useClass: CustomErrorHandlerX } for every module where you want a different ErrorHandler?
I added a sample repository there you can see, that everything is provided correctly and lazyloaded correctly.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.