Angular2 Http与RXJS Observable TypeError:this.http.get(...)。map(...)。catch不是函数

时间:2016-07-17 20:50:48

标签: typescript angular rxjs

我有以下服务工作正常,直到今天我收到此错误

TypeError: this.http.get(...).map(...).catch is not a function. 

当我调试这段代码时,它会在catch方法中崩溃。

import { Test } from "./home.component";
import { Injectable }     from "@angular/core";
import { Inject } from "@angular/core";
import { Http , Response  } from "@angular/http";
import { Observable }     from "rxjs/Observable";

@Injectable()
export class HomeService {
   public constructor(@Inject(Http)  private http: Http) {}

   public getData (): Observable<Test []> {
        return this.http.get("./src/app/home/home-data.json")
            .map(this.extractData).catch(this.handleError);
    }

    public extractData(res: Response) {
        let body = res.json();
        return body.data || { };
    }

    public handleError (error: any) {
        // In a real world app, we might use a remote logging infrastructure
        // We"d also dig deeper into the error to get a better message
        let errMsg = (error.message) ? error.message :
            error.status ? `${error.status} - ${error.statusText}` : "Server error";
        console.error(errMsg); // log to console instead
        return Observable.throw(errMsg);
    }
  }

3 个答案:

答案 0 :(得分:26)

似乎没有导入catch操作符。

您可以尝试像这样导入它:

import 'rxjs/add/operator/catch'

或者更常见的是,如果您想要有更多可观察方法:

import 'rxjs/Rx';

看到这个问题:

答案 1 :(得分:0)

我有同样的问题,但在我的情况下问题是,我在Module.ts中多次导入必需的模块

答案 2 :(得分:0)

'rxjs / O bservable'中的' O '字符必须为大写

以小写“ o ”指定它会给你这个和其他怪异的错误。 必须像这样导入:

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';

我花了一个小时才找到它。 通常,使用导入时,名称是小写的。 这是我第一次看到这个。 我希望它能帮助其他人:)