HttpClient

Relax. We'll talk through this in plain words — no textbook voice.

HttpClient is the service used to talk to external APIs (making HTTP requests). It returns RxJS Observables.

⚠️ Important: app.module.ts must import HttpClientModule.

typescript

// app.module.ts
import { HttpClientModule } from '@angular/common/http';

@NgModule({
  imports: [HttpClientModule]
})

// data.service.ts
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';

@Injectable({ providedIn: 'root' })
export class DataService {
  constructor(private http: HttpClient) { }
  
  getUsers() {
    return this.http.get('https://jsonplaceholder.typicode.com/users');
  }
}

// my.component.ts (in ngOnInit)
export class MyComponent implements OnInit {
  users: any[] = [];
  
  constructor(private dataService: DataService) {}
  
  ngOnInit() {
    this.dataService.getUsers().subscribe(users => {
      this.users = users;
    });
  }
}

You should see

(The component fetches user data from the API and stores it in the this.users property)