HTTP 响应错误处理 Angular 应用程序

Question

我有一个 data.json 文件，如下所示。

[
    {"value":1},
    {"value":2},
    {"value":3},
    {"value":3}
]

& 我正在使用 Http 来获取数据。数据正常传输，但是如果我的服务器关闭了，那么它会抛出错误，我想向用户显示一些自定义消息而不是该错误。下面是我获取数据的函数。

 data: any;

  getData() {
    this.http.get('http://localhost/php/data.json').subscribe((res) => {
      this.data = res;
      console.log(this.data);
    })
  }

  ngOnInit() {
    this.getData();
  }

Answer 1

  getData() {
    this.http.get('http://localhost/php/data.json').subscribe((res) => {
      this.data = res;
      console.log(this.data);
    },(err:HttpErrorResponse)=>{handle your error here});

subscribe 接受错误处理回调作为第二个参数。您可以在此处查看 API 详细信息

https://angular.io/api/common/http/HttpErrorResponse

Answer 2

您还可以使用 rxjs 提供的 catchError 运算符

import {catchError} from 'rxjs/operators'

this.http.get('http://localhost/php/data.json')
    .pipe ( 
       catchError((error) => // handle the error here; )
     )
    .subscribe((res) => {
      this.data = res;
      console.log(this.data);
    })