代码之家 › 专栏 › 技术社区 › AbhiRam

如何在Angular 4中获取HttpClient状态代码

angular

AbhiRam · 技术社区 · 6 年前

嗨,Angular的新成员,我面临着获取HTTP模块中的HTTP状态代码的问题,我可以使用 响应.状态 但是当我用 HttpClient 模块我拿不到响应.状态,显示找不到状态。

那么,我怎样才能拿到响应.状态使用 HttpClient客户端 模块输入 Angular 4&5 . 请帮忙。

雷斯t提供商:-

@Injectable()
export class RestProvider {

  private apiUrl = 'https://restcountries.eu/rest/v2/al';

  constructor(public http: HttpClient) {
    console.log('Hello RestProvider Provider');
  }

  getCountries(): Observable<{}> {
    return this.http.get(this.apiUrl).pipe(
      map(this.extractData),
      catchError(this.handleError)
    );
  }

  private extractData(res: Response) {
    let body = res;
    return body || { };
  }

  private handleError (error: Response | any) {
    let errMsg: string;
    if (error instanceof Response) {
      const err = error || '';
      errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
    } else {
      errMsg = error.message ? error.message : error.toString();
    }
    console.error(errMsg);
    return Observable.throw(errMsg);
  }

}

主页:

export class HomePage {

  responseStatus: number;

  countries: any;
  errorMessage: string;

  constructor(public navCtrl: NavController, public navParams: NavParams, public rest: RestProvider) {
  }

  ionViewDidLoad() {
    this.getCountries();
  }

  getCountries() {
    this.rest.getCountries().subscribe(res =>{
      this.countries=res;
      console("status code--->"+res.status)
    },
    err=>{
      console("status code--->"+err.status)
    })

  }
}

3 回复 | 直到 6 年前

Pardeep Jain 6 年前

要获得完整的响应,您需要向响应添加额外的属性 observe 像这样-

getCountries(): Observable<{}> {
    return this.http.get(this.apiUrl, {observe: 'response'}).pipe(
      map(this.extractData),
      catchError(this.handleError)
    );
  }

更多信息请参考-

Rohit Kavthekar 6 年前

添加 观察:'响应' 的标题选项http.get获取方法类

getCountries(): Observable<{}> {
    return this.http.get(this.apiUrl,{observe : 'response'}).pipe(
      map(this.extractData),
      catchError(this.handleError)
    );
  }

并订阅get()方法,以在主页中获得所需的响应状态

 getCountries() {
this.rest.getCountries().subscribe(
    res => {  this.countries=res;
  console("status code--->"+res.status)
},
err=>{
  console("status code--->"+err.status)
})
          },

NicuVlad 5 年前

你可以用 Angular's interceptor 在一个地方发现所有的错误并保持你的服务整洁。创建一个名为“error interceptor”的新拦截器,并添加intercept方法:

  intercept(request, next) {
    // Handle response
    return next.handle(request).pipe(
      catchError(error => {
        //handle specific errors
        if (error.status === 401) {
          this.handle401();
        }

        //default case: print, log, toast, etc...
        return throwError(error.message || error);
      })
    );
  }