HttpClient & RxJS

Code

import { Injectable, inject } from "@angular/core";
import { HttpClient } from "@angular/common/http";
import { Observable } from "rxjs";

export interface User { id: number; name: string; }

@Injectable({ providedIn: "root" })
export class UserApi {
  private http = inject(HttpClient);
  private base = "/api/users";

  getUsers(): Observable<User[]> {
    return this.http.get<User[]>(this.base);
  }
  create(user: Omit<User, "id">): Observable<User> {
    return this.http.post<User>(this.base, user);
  }
}

// Component usage:
// api.getUsers().subscribe(users => this.users = users);

Explanation

HttpClient performs typed HTTP requests and returns RxJS Observables. Generic type arguments describe the response shape so subscribers get fully typed data. Observables are cold and single-request; use subscribe to execute and consider takeUntil to avoid memory leaks.

More Angular Snippets