How to handle the error in angular with catch error

Question

I am using angular 7. This is my service.

get(){
return this.http.post(this.url).pipe(
catchError(this.handleError)
)
}

This is the error handler code.

handleError(errorResponse: HttpErrorResponse) {
    if (errorResponse.error instanceof ErrorEvent) {
      return throwError(errorResponse.error.message)
    } else {
      switch (errorResponse.status) {
        case 400:
          return throwError(errorResponse.error.message)
        case 401:
          return throwError(errorResponse.error.message)
        case 409:
          return throwError(errorResponse.error.message)
        case 500:
          return throwError(errorResponse.error.message)
      }
    }
  }

This is the error I am receiving when the submit button is pressed.

core.js:15714 ERROR TypeError: You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
    at subscribeTo (subscribeTo.js:41)
    at subscribeToResult (subscribeToResult.js:11)
    at CatchSubscriber.push../node_modules/rxjs/_esm5/internal/operators/catchError.js.CatchSubscriber.error (catchError.js:43)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error (Subscriber.js:79)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (Subscriber.js:59)
    at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error (Subscriber.js:79)
    at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (Subscriber.js:59)
    at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/OuterSubscriber.js.OuterSubscriber.notifyError (OuterSubscriber.js:13)
    at InnerSubscriber.push../node_modules/rxjs/_esm5/internal/InnerSubscriber.js.InnerSubscriber._error (InnerSubscriber.js:18)
    at InnerSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (Subscriber.js:59)

please help me in this situation.

You probably don't return anything from in `catchError`'s callback. — martin, Feb 06 '19 at 08:48
use try catch. Put your code in try and in catch console the error. — Balaj Khan, Feb 06 '19 at 08:50
Possible duplicate of [TypeError: You provided an invalid object where a stream was expected. You can provide an Observable, Promise, Array, or Iterable](https://stackoverflow.com/questions/43549223/typeerror-you-provided-an-invalid-object-where-a-stream-was-expected-you-can-p) — BadPiggie, Feb 06 '19 at 08:51
whats is the response of the HTTP request that causes the issue? you might need to add a default case to your switch — Jota.Toledo, Feb 06 '19 at 09:08

score 1 · Answer 1 · answered Feb 06 '19 at 09:59

You are returning undefined from your catchError operator. The catchError operator expects you to return an observable.

get(){
    return this.http.post(this.url).pipe(
        catchError((err) => {
            // handle the error

            // use the empty() factory method to return an observable
            // that emits nothing and completes
            return empty();
        })
    )
}

Reference: empty

score 0 · Answer 2 · answered Feb 06 '19 at 08:52

This is an error stating that you have failed to provide a stream in your observable.

This usually happens when you don't provide an observable to operators such as switchMap, combineLatest, or in this case, catchError.

Simply add a

return of(undefined);

in your catchError to resolve the issue.

How to handle the error in angular with catch error

2 Answers2