Angular Tutorial - 22 - HTTP Error Handling

📱 Follow Codevolution

Angular | Angular Tutorial for Beginners | HTTP Error Handling

[Codevolution]

Catch and Throw was updated with Rxjs version change. Please watch video #31 for a working example.

[mariya_]

In angular 8:
Import throwError from rxjs
Import catchError from rxjs/operators
Use catchError and throwError instead of catch and throw.
Also use pipe when using catchError


Thank you codevolution...you have been great help

[technilicious]

I love it when you say - Let me go over it one more time.... I really helps in understanding the concept better.... Thank you...

[simpleway]

import { Observable, throwError } from 'rxjs';
import { catchError, } from 'rxjs/operators';

then use throwError instead of Observable.throw

[idlevandal]

For those using Angular 7 see Darwin Batres comment for updated code & imports then also change errorHandler() to the following:

errorHandler(error: HttpErrorResponse) {
return throwError(error.message || "Server Error!");
}

-Notice errorHandler() method doesn't use but now uses just throwError(error.message)

[sandman_theory]

Thank you By far the best Angular Tutorial on YouTube. Period!

[apprendrelefrancais]

1) if there is error about Observable, then you need to modify import: import { Observable } from 'rxjs';
2) if "catch" has error then you need to upgrad rxjs in terminal: npm i rxjs-compat

[weicao]

Respect from China. Very useful and clear.

[MayankGupta-kqdm]

I think you only change Name Angular 7 but tutorial is angular 5

[commentorsilensor]

Thank you very much for the video. I know it is frustrating that Angular keeps changing. I know some Angular 2. after seeing the change, I just start all over again on Angular 8. That is very frustrating. Thanks for the other video., Thanks for other people input to correct the problem.

[arnavkumar]

Observable.throw method is now deprecated. It is now replaced with throwError(error.message) where error is instance of HttpErrorResponse class. Same goes for catch. For catch use method name)) and also import catchError and throwError.

[crazy_coder]

your style to teach us is amazing very simple and understaning language that u use
i watched many videos but ur videos are too good and also thanku for updating code in git for rxjs6

THANKU SO MUCH SIR

Great Tutorial Series - the best explanation i have seen so far. I've learned a lot. Thank you! And i with that i mean all lessons in this playlist!!!

[programmersinsight]

To import the full Observable object you'd import it like this:

import { Observable } from 'rxjs/Rx'

Hopefully that helps!

[jeslinjoju]

Very good explanation. Really helpful. Thanks

[devakireddy]

Hi sir when i write catch am not able to compile the code an getting the error as
"Property 'catch' does not exist on type you please provide the solution for this

[hoangngovan]

Love it!, very easy to understanding. Thanks a lot.

[adnansheikh]

Hi,
Thank you for posting this helpful guide.
I'm doing authentication via API. The problem is i can't use subscribe with canActivate as it has Observable<boolean> type. I can't change the Observable type as my whole functionality depends upon this type.

So I have to use map instead of subscribe but then this authentication doesn't work. Please help me. I'm stuck on this from days.

[amanullahaman]

Very nice video with a good explanation. Please upload more videos.

[wayne_gakuo]

Angular v8+
import { Observable, throwError } from 'rxjs';
import { catchError} from 'rxjs/operators';
You need to pass the catchError operator through the pipe.
...
.pipe(

errorHandler(error: HttpErrorResponse) {
return throwError (`Something went wrong: ${error.message}`);
}
PS: In the return statement of the errorHandler() function, I have used backticks instead of quotation marks, i.e template literals