Angular 4.3及更高版本的HttpClientModule ( HTTPClient )错误处理

import { HttpClient, HttpErrorResponse } from '@angular/common/http';

constructor(private http: HttpClient) { }

getData() {
  this.http.get('api/data').subscribe(
    (response) => {
      // 处理成功响应
    },
    (error: HttpErrorResponse) => {
      if (error.error instanceof Error) {
        // 客户端错误
        console.log('Client-side error:', error.error.message);
      } else {
        // 服务器错误
        console.log('Server-side error:', error.status, error.statusText);
      }
    }
  );
}

import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { catchError } from 'rxjs/operators';
import { throwError } from 'rxjs';

constructor(private http: HttpClient) { }

getData() {
  this.http.get('api/data').pipe(
    catchError((error: HttpErrorResponse) => {
      if (error.error instanceof Error) {
        // 客户端错误
        console.log('Client-side error:', error.error.message);
      } else {
        // 服务器错误
        console.log('Server-side error:', error.status, error.statusText);
      }
      return throwError('Something went wrong. Please try again later.');
    })
  ).subscribe(
    (response) => {
      // 处理成功响应
    }
  );
}