Angular 4 - Observable catch error

Question

How can I solve the problem of return with error, use the capture inside the Observable?

I want to execute a function inside the catch, to do some validation before the subscribe is executed.

Thank you in advance, thank you very much for your attention.

Error occurs in -> .catch( (e) => {console.log(e)} )

import { Injectable } from '@angular/core';
import { Headers, Http, ResponseOptions} from '@angular/http';
import { AuthHttp } from 'angular2-jwt';

import { MEAT_API } from '../app.api';

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

@Injectable()
export class  CompareNfeService {


    constructor(private http: AuthHttp) { }

    envirArquivos(order): Observable<any> {
        const headers = new Headers();
        return this.http.post(`${MEAT_API}compare/arquivo`, order,
        new ResponseOptions({headers: headers}))
        .map(response => response.json())
        .catch( (e) => {console.log(e)} );
    }
}

Error

ERROR in /XXXXXX/application/src/app/compare/service.ts (28,17): Argument of type '(e: any) => void' is not assignable to parameter of type '(err: any, caught: Observable) => ObservableInput<{}>'.
Type 'void' is not assignable to type 'ObservableInput<{}>'.

Answer 1

If you want to use the catch() of the Observable you need to use Observable.throw() method before delegating the error response to a method

 import { Injectable } from '@angular/core'; import { Headers, Http, ResponseOptions} from '@angular/http'; import { AuthHttp } from 'angular2-jwt'; import { MEAT_API } from '../app.api'; import { Observable } from 'rxjs/Observable'; import 'rxjs/add/operator/map'; import 'rxjs/add/operator/catch'; @Injectable() export class CompareNfeService { constructor(private http: AuthHttp) {} envirArquivos(order): Observable < any > { const headers = new Headers(); return this.http.post(`${MEAT_API}compare/arquivo`, order, new ResponseOptions({ headers: headers })) .map(response => response.json()) .catch((e: any) => Observable.throw(this.errorHandler(e))); } errorHandler(error: any): void { console.log(error) } } 

Using Observable.throw() worked for me

Answer 2

catch needs to return an observable.

.catch(e => { console.log(e); return Observable.of(e); })

if you'd like to stop the pipeline after a caught error, then do this:

.catch(e => { console.log(e); return Observable.of(null); }).filter(e => !!e)

this catch transforms the error into a null val and then filter doesn't let falsey values through. This will however, stop the pipeline for ANY falsey value, so if you think those might come through and you want them to, you'll need to be more explicit / creative.

edit:

better way of stopping the pipeline is to do

.catch(e => Observable.empty())

Answer 3

With angular 6 and rxjs 6 Observable.throw() , Observable.off() has been deprecated instead you need to use throwError

ex :

return this.http.get('yoururl')
  .pipe(
    map(response => response.json()),
    catchError((e: any) =>{
      //do your processing here
      return throwError(e);
    }),
  );

Answer 4

You should be using below

return Observable.throw(error || 'Internal Server error');

Import the throw operator using the below line

import 'rxjs/add/observable/throw';