HttpClient is Angular's built-in service for making HTTP requests. It returns Observables (not Promises), integrates with RxJS operators, and supports typed responses, interceptors, and error handling.
{ } ;
{ } ;
({ : })
{
() {}
() {
..<[]>();
}
() {
..<>(, user);
}
() {
..();
}
}
The generic (<User[]>) types the response. Requests are lazy — they only fire when subscribed.
ngOnInit() {
this.userService.getUsers().subscribe(users => this.users = users);
}
// or with the async pipe (no manual subscribe/unsubscribe):
users$ = this.userService.getUsers();
// template: <li *ngFor="let u of users$ | async">
import { HttpParams, HttpHeaders } from "@angular/common/http";
this.http.get("/api/users", {
params: new HttpParams().set("page", "1").set("limit", "10"), // ?page=1&limit=10
headers: new HttpHeaders({ Authorization: `Bearer ${token}` }),
});
import { catchError, retry } from "rxjs/operators";
import { of } from "rxjs";
this.http.get<User[]>("/api/users").pipe(
retry(2), // retry failed requests twice
catchError(err => {
console.error(err);
return of([]); // fallback value, keep the stream alive
})
).subscribe(users => this.users = users);
Because it's Observable-based, you compose retries, fallbacks, timeouts, and transforms with operators.
HTTP interceptors automatically attach auth tokens, log requests,
handle errors globally, or show loading spinners — for ALL requests.
HttpClient is how Angular apps talk to backends — typed, Observable-based, and composable with RxJS for retries/fallbacks/transformations.
Its Observable nature (vs fetch's Promises) integrates it with the rest of Angular (async pipe, operators, interceptors).
Knowing typed requests, options, error handling, and pairing with the async pipe covers practically all data-fetching needs in Angular.