Angular 2 : Get 404 error in http.get call with Observable return

Question

i have a little problem, i have this code which work when it has to return a status 200 (all is OK)

   httpCallGet(pathToCall: string, varToSend: string ): Observable<any> {
    return this.http.get(this.url + pathToCall + varToSend, {headers : this.headers} )
        .map( res => res.json())
        .catch(this.handleError);
}

But when the URL is wrong and i have a 404 error, my site just crash with a console error.

How can i properly catch this type of error without error on the console and can i retry when error ?

I try .retry(3) but this code don't work and .subscribe don't work with Observable return (i'm not very easy with Observable ^^)

As someone an idea to fix this ?

Answer 1

Have your service return an observable that either returns the result or throws the error.

 httpCallGet(pathToCall: string, varToSend: string ): Observable<any> {
  return this.http.get(this.url + pathToCall + varToSend, {headers : this.headers} )
    .map( res => res.json())
    .catch(error => Observable.throw('error');
};

Then in your component, handle the error.

getHttpData = () => {
  this.service.httpCallGet('someurl', '')
    .subscribe(
      result => this.handleResult(result),
      error => this.handleError(error)
    )
};

handleResult = (data) => {
  // do stuff with data
};

handleError = (error) => {
  // do stuff with error
};