0 Tage Serie
javascript / intermediate
Snippet

Benutzerdefinierter globaler ErrorHandler für unbehandelte Ausnahmen

Angular stellt die ErrorHandler-Klasse als erweiterbaren Hook bereit, um unbehandelte Ausnahmen über den gesamten Anwendungslebenszyklus hinweg abzufangen. Durch Vererbung von ErrorHandler können Entwickler sowohl synchrone Laufzeitfehler als auch asynchrone Fehler (wie unbehandelte HTTP-Antworten) untersuchen. Die Ausführung von Benachrichtigungen innerhalb von NgZone.run stellt sicher, dass UI-Seiteneffekte die Change Detection auslösen, selbst wenn Fehler außerhalb des Standardkontexts auftreten.

snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
import { ErrorHandler, Injectable, NgZone, inject } from '@angular/core';
import { HttpErrorResponse } from '@angular/common/http';
import { NotificationService } from './notification.service';
@Injectable()
export class GlobalLoggingErrorHandler implements ErrorHandler {
private readonly zone = inject(NgZone);
private readonly notifier = inject(NotificationService);
handleError(error: unknown): void {
const timestamp = new Date().toISOString();
const errorDetails = error instanceof HttpErrorResponse
? `HTTP ${error.status}: ${error.message}`
: error instanceof Error ? error.stack ?? error.message : String(error);
console.error(`[${timestamp}] Uncaught Error:`, errorDetails);
this.zone.run(() => {
this.notifier.showToast('An unexpected application error occurred.');
});
}
}
angular
Erklärung
1
export class GlobalLoggingErrorHandler implements ErrorHandler {
Implementiert das zentrale Angular-ErrorHandler-Interface, um die Standard-Fehlerprotokollierung zu überschreiben.
2
const errorDetails = error instanceof HttpErrorResponse
Führt eine Typunterscheidung durch, um je nach Fehlertyp (Netzwerkfehler oder Standard-Error) passende Details zu extrahieren.
3
this.zone.run(() => {
Wechselt zurück in die Angular-Ausführungszone, damit UI-Aktualisierungen wie Toast-Benachrichtigungen sofort die Change Detection auslösen.