typescript 类型“Observable”上不存在属性“catch”< any>

xam8gpfp 于 2023-02-05 发布在 TypeScript

关注(0)|答案(4)|浏览(129)

在使用Http服务的Angular 2文档页面上有一个示例。

getHeroes (): Observable<Stuff[]> {
  return this.http.get(this.url)
                  .map(this.extractData)
                  .catch(this.handleError);
}

我克隆了angular2-webpack-starter项目并自己添加了上面的代码。
我使用导入了Observable

import {Observable} from 'rxjs/Observable';

我假设属性Observable也被导入了（.map可以工作）。查看了rxjs.beta-6的修改日志，没有提到catch。

typescript

来源：https://stackoverflow.com/questions/37073705/property-catch-does-not-exist-on-type-observableany

4条答案

按热度按时间

hsgswve41#

- 警告**：此解决方案自Angular 5.5起已弃用，请参阅下面的Trent回答

=====================
是，需要导入操作员：

import 'rxjs/add/operator/catch';

或者按以下方式导入Observable：

import {Observable} from 'rxjs/Rx';

但在本例中，导入所有操作符。
请参阅此问题了解更多详细信息：

带有类型脚本错误的Angular HTTP GET http. get（...）. map不是[null]中的函数

赞(0）回复(0）举报 2023-02-05

3duebb1j2#

在RxJS 5.5+中，catch运算符现在被弃用。现在您应该将catchError运算符与pipe结合使用。
RxJS v5.5.2是Angular 5的默认依赖版本。
对于您导入的每个RxJS运算符，包括catchError，您现在应该从“rxjs/operators”导入并使用管道运算符。

捕获Http请求错误的示例可观察

import { Observable } from 'rxjs';
import { catchError } from 'rxjs/operators';
...

export class ExampleClass {
  constructor(private http: HttpClient) {
    this.http.request(method, url, options).pipe(
      catchError((err: HttpErrorResponse) => {
        ...
      }
    )
  }
  ...
}

请注意，这里catch被替换为catchError，并且pipe运算符用于组合运算符，其方式与您习惯使用点链的方式类似。*

有关详细信息，请参见pipable（以前称为lettable）运算符的rxjs文档。

赞(0）回复(0）举报 2023-02-05

eblbsuwk3#

在Angular 8：

//for catch:
import { catchError } from 'rxjs/operators';

//for throw:
import { Observable, throwError } from 'rxjs';

//and code should be written like this.

getEmployees(): Observable<IEmployee[]> {
    return this.http.get<IEmployee[]>(this.url).pipe(catchError(this.erroHandler));
  }

  erroHandler(error: HttpErrorResponse) {
    return throwError(error.message || 'server Error');
  }

赞(0）回复(0）举报 2023-02-05

xzv2uavs4#

检查您正在使用的Angular 版本及其相关内容：从“rxjs”导入{可观测};或从'rxjs/Rx'中导入{Observable};

赞(0）回复(0）举报 2023-02-05