Question

在使用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。

Answer 1

是的，您需要导入运营商：

import 'rxjs/add/operator/catch';

或者以这种方式导入Observable：

import {Observable} from 'rxjs/Rx';

但在这种情况下，您导入所有运算符。

有关详细信息，请参阅此问题：

Angular 2 HTTP GET with TypeScript error http.get(...).map is not a function in [null]

Answer 2

使用RxJS 5.5+，catch运算符现已弃用。您现在应该将catchError运算符与pipe结合使用。

RxJS v5.5.2是Angular 5的默认依赖版本。

对于您导入的每个RxJS运算符，包括catchError，您现在应该从'rxjs /运算符'导入并使用管道运算符。

捕获Http请求Observable

的错误示例

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文档。

Answer 3

In 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');
  }

物业＆＃39; catch＆＃39;类型＆＃39; Observable <any>＆＃39;

3 个答案:

捕获Http请求Observable