What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more
Angular does not automatically send every application error to its global ErrorHandler. Errors thrown while Angular runs framework-managed application code can be caught and forwarded, but errors in APIs your code calls directly should usually be handled at that callsite. Use local handling for recovery and the global handler for reporting unexpected failures. Angular’s unhandled-errors guide describes the capture rules and the exceptions.
Which errors does Angular catch?
The key question is how the operation was invoked. Angular catches errors while it invokes application code through framework-managed flows, such as component construction and lifecycle methods. It does not automatically wrap every method your application calls. For example, if a component directly calls a service method and that method throws, handle the failure in the calling code rather than assuming it will reach ErrorHandler.
The caller typically has the information needed to choose a useful response: retry, show an error state, use a fallback value, or stop the operation. Angular therefore recommends handling expected failures where they occur. A global handler is chiefly for reporting unexpected failures that escape local handling and framework capture.
Async failures depend on the API contract
Angular forwards an asynchronous error when a framework API explicitly waits for and uses the result, and the failure is not already represented in returned state. For example, errors from AsyncPipe and PendingTasks.run are forwarded to ErrorHandler. By contrast, Angular’s resource API exposes failures through its status and error properties; read that state and decide how the application should respond.
#1 Best Overall
For a promise or observable that your application starts and consumes directly, handle rejection or error in that flow. In synchronous code, use try...catch; in an RxJS pipeline, use an appropriate operator such as catchError when the caller can recover.
How to handle errors where they occur
Choose recovery based on the operation and the user-visible consequence. Keep the response close to the code that knows whether the failure is recoverable.
- Synchronous call: surround the operation with
try...catchif it can throw and you can respond meaningfully. - Observable flow: use an operator such as
catchErrorto transform the failure, provide a fallback, or let it propagate when local recovery is not appropriate. - Resource state: inspect the resource’s
statusanderrorproperties and render or recover based on that state. - Unexpected failure: allow it to reach centralized reporting rather than disguising it as a successful result.
Use ErrorHandler to centralize logging or error-tracking for unexpected failures. It is not a substitute for the user-facing recovery logic that belongs at the callsite.
Recommended Free Tools
How to forward browser-global errors
In browser applications, provideBrowserGlobalErrorListeners() registers listeners for the browser’s error and unhandledrejection events and forwards them to ErrorHandler. Angular’s guide says the CLI includes this provider in new applications by default. Check the configuration for the Angular version and project you are using before adding it; do not add duplicate custom listeners that do the same work.
Rank #3
When global forwarding is needed, configure the provider in the application’s providers:
import { provideBrowserGlobalErrorListeners } from '@angular/core';
bootstrapApplication(AppComponent, {
providers: [provideBrowserGlobalErrorListeners()]
});See the official provider API reference for its behavior. Forwarding an unhandled event is useful for reporting, but it does not determine the right recovery for a particular operation.
How error handling differs with server-side rendering
Server-side rendering (SSR) uses process-level listeners rather than relying solely on the browser provider. Angular adds unhandledRejection and uncaughtException listeners to the server process and logs captured errors to the console. When Zone.js is used, Angular adds only the unhandledRejection process handler because errors inside the application zone are already forwarded to ErrorHandler. Account for the server runtime and Zone.js configuration when diagnosing server-side failures.
Do these 3 things before closing this tab:
1Clear out junk files and repair common Windows errors2Fix the driver behind crashes, sound loss and screen glitches3Repair Windows errors before they cause bigger problemsHow to handle router and resolver failures
Routing failures have routing-specific handling options. For resolver failures and navigation errors, Angular documents three approaches: configure withNavigationErrorHandler, subscribe to router events, or handle the failure inside the resolver. Choose the approach that has the context needed to decide whether navigation should recover, redirect, or fail.
See Angular’s route data resolvers guide for the documented options.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.When Angular rendering boundaries can show a fallback
Angular’s @boundary and @error rendering feature can display fallback UI for errors during initialization or change detection. It supports resetting a boundary and conditionally selecting fallback content. The feature is in developer preview; verify its status for your Angular version before relying on it in production.
A boundary does not catch errors from projected content rendered through ng-content. Put the boundary where the projected content is declared, rather than expecting a wrapper around ng-content to catch its failures. Boundary errors may also be reported through a custom handler’s onViewError hook. Read Angular’s error-boundaries guide for the feature’s behavior and limitations.
Quick wins for a faster PC:
Fix the driver behind crashes, sound loss and screen glitchesFind Drivers →Repair Windows errors before they cause bigger problemsFix Now →Testing and startup edge cases
TestBed rethrows unexpected application errors
Angular’s TestBed rethrows unexpected application errors by default. This helps tests expose failures instead of silently treating them as handled. Keep that behavior unless a test is specifically verifying how the application responds to an error.
Some startup errors happen before a handler exists
An error thrown before the root application instance exists cannot yet be sent to a provided ErrorHandler. Angular notes that this can happen when defining an Angular element if its tag is already present on the page. In that situation, the application’s provided handler is not available in time to capture the error.
Quick Recap
Choosing the right handling point
| Where the failure occurs | What to do | Purpose |
|---|---|---|
| Direct synchronous call or application-owned async flow | Handle at the callsite with try...catch or an appropriate observable/promise flow |
Recover with the context specific to the operation |
| Framework-managed application code | Let Angular forward unexpected captured errors to ErrorHandler |
Central reporting |
Browser-global error or unhandledrejection |
Use provideBrowserGlobalErrorListeners() when needed |
Forward browser-global failures for reporting |
| Resolver or navigation failure | Use withNavigationErrorHandler, router-event subscriptions, or resolver-level handling |
Respond in the routing context |
| Initialization or change-detection rendering failure | Consider @boundary and @error after checking their preview status and limitations |
Render fallback UI |
| SSR process-level failure | Account for Angular’s process listeners and Zone.js behavior | Server-side capture and logging |
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
