错误 TS2339：“Observable<any>”类型上不存在属性“catchError”答案

【问题标题】：error TS2339: Property 'catchError' does not exist on type 'Observable<any>'错误 TS2339：“Observable<any>”类型上不存在属性“catchError”
【发布时间】：2021-03-09 15:23:03
【问题描述】：

这是我在 book.service.ts 中的代码：

import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import {Observable} from 'rxjs';
import { Book } from './book';
import { map } from "rxjs/operators";
import { catchError } from 'rxjs/operators';

//import { Component, OnInit } from '@angular/core';
//import {HttpClient} from "@angular/common/http";
//import { Observable } from 'rxjs/Observable'; 
//import 'rxjs/add/operator/map';
//import 'rxjs/add/operators/catch';
//import 'rxjs/operators/toPromise';

@Injectable()
export class BookService 
{
    url = "http://localhost:4200/assets/data/books.json";

    constructor(private http:Http) { }

    getBooksWithObservable(): Observable<Book[]> 
    {
        return this.http.get(this.url)
                .pipe(map(this.extractData))
                .catchError(this.handleErrorObservable);
    }
    getBooksWithPromise(): Promise<Book[]> 
    {
        return this.http.get(this.url).toPromise()
            .then(this.extractData)
            .catch(this.handleErrorPromise);
    }
    private extractData(res: Response) 
    {
        let body = res.json();
        return body;
    }
    private handleErrorObservable (error: Response | any) 
    {
        console.error(error.message || error);
        //console.log("Error in Observable");
        return Observable.throw(error.message || error);
    }
    private handleErrorPromise (error: Response | any) 
    {
        console.error(error.message || error);
        return Promise.reject(error.message || error);
    }   
}

我在这里遇到错误：

src/app/book.service.ts(26,18) 中的错误：错误 TS2339：“Observable”类型上不存在属性“catchError”。

嗯，错误在第 26 行，那就是：

.catchError(this.handleErrorObservable);

我尝试了很多东西，但没有任何效果...有人可以解决这个问题吗？

使用 'catch' 但没有用，所以我选择了 'catchError' 但仍然有这个错误...

【问题讨论】：

标签： angular angular-services

【解决方案1】：

catchError需要导入，然后在.pipe中使用：

import {catchError} from 'rxjs/operators'; 

return this.http.get(this.url)
            .pipe(
              map(this.extractData),
              catchError(this.handleErrorObservable)
            );

【讨论】：

路径不正确import {catchError} from 'rxjs/operators
@Krack 取决于你使用的 RxJS 版本。

【解决方案2】：

你需要像这样在pipe 中使用它：

getBooksWithObservable(): Observable<Book[]> {
  return this.http.get(this.url)
             .pipe(map(this.extractData),catchError(this.handleErrorObservable));
}

【讨论】：

你明白了兄弟！完成了...非常感谢，顺便说一句:-)

【解决方案3】：

catchError 必须在 pipe 内。

 import { Observable, pipe } from 'rxjs';
 import { map, catchError } from 'rxjs/operators';

 getBooksWithObservable(): Observable<Book[]> 
    {
        return this.http.get(this.url)
                .pipe(
                   map(this.extractData),
                   catchError(this.handleErrorObservable)
                 );                    
    }

【讨论】：

【解决方案4】：

你必须改为：

...
return this.http.get(this.url).subscribe((r:Author)=>console.log("GOOD"),err=>console.log("ERROR))
...

这是rxjs的问题

【讨论】：