title: Angular2 Http with RXJS Observable TypeError: this.http.get(...).map(...).catch is not a function
body: <p>I have following Service which was working fine until today i got this error</p>
  
  
  
  <blockquote>
  <pre class="lang-typescript prettyprint-override"><code>TypeError: this.http.get(...).map(...).catch is not a function. 
  </code></pre>
  </blockquote>
  
  <p>When I'm debugging this code it crashes when it comes to catch method. </p>
  
  <pre class="lang-typescript prettyprint-override"><code>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&lt;Test []&gt; {
          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);
      }
    }
  </code></pre>