代码之家 › 专栏 › 技术社区 › Pissu Pusa

在Observable<Response>

rxjs6 angular6 http

1

Pissu Pusa · 技术社区 · 7 年前

我试图捕捉来自http请求的错误,并基于错误代码向用户显示错误消息。为此,我使用rxjs中的catch error运算符。

但我得到的错误是 属性“ClcError”不存在于类型可观察性和LT响应GT;

下面是我的包.json

"dependencies": {
"@angular/animations": "^6.0.3",
"@angular/common": "^6.0.3",
"@angular/compiler": "^6.0.3",
"@angular/core": "^6.0.3",
"@angular/forms": "^6.0.3",
"@angular/http": "^6.0.3",
"@angular/platform-browser": "^6.0.3",
"@angular/platform-browser-dynamic": "^6.0.3",
"@angular/router": "^6.0.3",
"bootstrap": "^3.3.7",
"core-js": "^2.5.4",
"rxjs": "^6.0.0",
"zone.js": "^0.8.26"

下面是我在实现的服务中用来处理http请求的导入。

import { catchError } from 'rxjs/operators';
import { Injectable } from '@angular/core';
import { Http } from '../../../node_modules/@angular/http';
import { Observable } from 'rxjs';
import { AppError } from './../common/app-error';
import { NotFoundError } from '../common/not-found-error';

这是一个函数,我从服务器中删除一个post,并将预期错误和意外错误的自定义错误返回给我的组件。

deletePost(id:number){
return this.http.delete(this._url+"/"+id).catchError(
  (error:Response)=>{
    if(error.status===404){
      return Observable.throw(new NotFoundError());
    }
    return Observable.throw(new AppError(error));
  }
);

}

但是当我试图删除一篇文章时,我得到了以下错误。

this.http.delete(...).catchError is not a function

我指的是 API for rxjs ,根据我的理解,在这里catcherror函数期望一个可观测值作为输入。如果有人能帮我解决这个问题,我将非常感谢谢谢您。

1 回复 | 直到 7 年前

1

5

Pissu Pusa 7 年前

我想出来了我需要先使用pipe()运算符,然后才能使用像rxjs 6以后的catchError这样的运算符因此,应该像下面这样修改代码。

deletePost(id:number){
return this.http.delete(this._url+"/"+id)
.pipe(
  catchError(
    (error:Response)=>{
      if(error.status===404){
        return Observable.throw(new NotFoundError());
      }
      return Observable.throw(new AppError(error));
    }
));}

更新

要使其正常工作,还需要做一点小小的更改,因为throw函数的实现也已使用rxjs6进行了更改。现在不需要从observate抛出错误函数,而是必须使用throw error()函数上述任务的实现如下。

  deletePost(id:number){
return this.http.delete(this._url+"/"+id)
.pipe(
  catchError(
    (error:Response)=>{
      if(error.status===404){
        console.log(error);
        return throwError(new NotFoundError(error));
      }
      return throwError(new AppError());
    }
));}

我希望有人会发现这有帮助,并节省几个小时的时间。干杯!