How can I use Angular's HttpClient for advanced API interactions?

How can I use Angular's HttpClient for advanced API interactions?

You can use Angular's HttpClient to make HTTP requests to APIs. For advanced interactions, consider using observables, interceptors, and error handling.

What are interceptors and how do they work with HttpClient?

Interceptors are a powerful feature that allows you to modify requests and responses globally. You can use them to add headers, log requests, or handle errors.

Can you show me an example of an interceptor?

Sure! Here's a simple example of an interceptor that adds an authorization token to every request:

import { Injectable } from '@angular/core';
import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const clonedRequest = request.clone({
      setHeaders: { 'Authorization': `Bearer YOUR_TOKEN` }
    });
    return next.handle(clonedRequest);
  }
}

How do I handle errors when making HTTP requests?

You can handle errors using the catchError operator from RxJS. Here's an example:

this.http.get('api/url').pipe(
  catchError(error => {
    console.error('Error occurred:', error);
    return throwError(error);
  })
).subscribe(...);