Die Anwendung hat ihre Seiten (0201); jetzt bekommen sie Daten. Aus der Sicht der API-Seite sind Sie der Aufrufer: Ihr Client muss mit Statuscodes, ProblemDetails (K2 2.3.7) und Netzfehlern umgehen, und das soll an einer Stelle geschehen, nicht in jeder Komponente. Diese Lektion baut diese Stelle, drei Interceptoren in src/app/core/api, und zeigt die zwei Wege, Daten zu holen: httpResource für Lesendes, HttpClient für alles andere. Der typisierte Client aus dem OpenAPI-Dokument folgt in 0203; hier schreiben wir die Typen noch von Hand.

Stand der Prüfung. Der Code stammt aus einem Wegwerfprojekt außerhalb des Repositorys (Node 24.22.3, Angular 22.2.6, TypeScript 6.0.3, RxJS 7.8.2, Vitest 5.1.0). Gelaufen sind ng build (Exit-Code 0) und ng test --no-watch mit den Tests dieser Lektion (Interceptoren, Kontaktliste, Termine; Endstand des Projekts nach 0204: 32 Tests in 7 Dateien, Exit-Code 0). Alle Tests antworten mit HttpTestingController: keine Anfrage ging an eine laufende API oder in einen Browser. Nicht ausgeführt: ng serve mit Proxy gegen die Kladde-API, ein echter Netzfehler. Wo K2 Felder anders nennt, gilt K2: Stand K2 prüfen (2.3.7 ProblemDetails, 2.12.1 Fortsetzungsmarke). Der Name next für das Feld der Marke in der Antwort der Termine ist unsere Annahme; der Vertrag nennt nur den Parameter after. Aussagen zu httpResource und Interceptoren stammen von den Seiten der Angular-Dokumentation, am Schreibtag gelesen.

Anfragen stellen: HttpClient und was die Typen versprechen

HttpClient wird mit provideHttpClient(...) angemeldet, inject(HttpClient) liefert ihn. Jede Methode gibt ein Observable zurück; die Anfrage geht erst beim Abonnieren los. get<T>(url) liefert den Körper als T. Das T ist ein Versprechen des Programmierers: Angular prüft zur Laufzeit nichts. Kommt etwas anderes, erfahren Sie es erst beim Zugriff; 0203 löst das, indem die Typen aus dem Vertrag entstehen. Bis dahin liegen die Formen in einer Datei:

src/app/core/api/vertrag.ts (Auszug):

TypeScript
export interface ContactPage {
  contacts: ContactSummary[];
  total: number;
  page: number;
  pageCount: number;
}

export interface AppointmentPage {
  appointments: AppointmentResponse[];
  next: string | null;
}

Zeiten sind in diesem Vertrag Zeichenketten (ISO 8601 mit Versatz, K2 2.3.9); ein string wird erst zu einem Datum, wenn Sie es entscheiden.