1
00:00:00,120 --> 00:00:00,810
Bienvenidos.

2
00:00:00,840 --> 00:00:04,320
Continuamos con el manejo de error en Angular, como vimos en el backend.

3
00:00:04,410 --> 00:00:09,570
Las cosas podrían ir mal, especialmente cuando se obtienen datos desde un servidor remoto.

4
00:00:09,660 --> 00:00:14,940
Entonces Angular debería detectar estos errores y poder canalizar o hacer algo con ellos.

5
00:00:15,000 --> 00:00:19,580
Así que nos vamos a ir a clientes y clientes serveis.

6
00:00:19,720 --> 00:00:22,920
Es justamente acá donde estamos trabajando con nuestros datos.

7
00:00:22,980 --> 00:00:26,310
Estamos obteniendo la lógica de negocio desde el backend.

8
00:00:26,400 --> 00:00:32,100
Vamos a partir primero con el cliente por ahí, que sería básicamente cuando mostramos los datos en

9
00:00:32,100 --> 00:00:33,870
el formulario para editar.

10
00:00:33,960 --> 00:00:36,600
Lo primero que necesitamos es un operador.

11
00:00:36,690 --> 00:00:38,430
Lo tenemos que importar.

12
00:00:38,730 --> 00:00:42,470
Lo importamos desde RX 10 operator.

13
00:00:42,570 --> 00:00:45,920
Entonces, después de MAP simplemente agregamos catch error.

14
00:00:48,030 --> 00:00:52,080
Este operador se encarga de interceptar el observable.

15
00:00:52,200 --> 00:00:58,800
El flujo lo intercepta en busca de falla y si falla, obtenemos este objeto de error dentro del operador

16
00:00:58,890 --> 00:01:01,170
en una función de flecha o expresión lanta.

17
00:01:01,230 --> 00:01:04,020
Y de ahí lo podemos manejar y podemos hacer lo que queramos con él.

18
00:01:04,350 --> 00:01:06,540
Tenemos que utilizar el método Pipe.

19
00:01:09,480 --> 00:01:15,680
Dentro mtodo pibe, acá podemos tener todos los operadores del flujo catch erros.

20
00:01:15,810 --> 00:01:21,810
Obtenemos el error lo estamos recibiendo por argumento en la función de flecha o anónima y acá lo podemos

21
00:01:21,810 --> 00:01:22,260
manejar.

22
00:01:22,350 --> 00:01:22,860
Perfecto.

23
00:01:22,920 --> 00:01:25,230
Y ahora, cómo detecta o canaliza este error?

24
00:01:25,320 --> 00:01:28,950
A través del estado del status de la respuesta?

25
00:01:29,040 --> 00:01:34,770
Recordemos que estamos retornando en Spring, en el Wacken, cuando no encuentra el objeto o el registro

26
00:01:34,770 --> 00:01:40,770
por SAIDI, retornamos un 404 not found o si ocurre un error más complicado.

27
00:01:40,860 --> 00:01:46,560
Aniel de hace rato en el servidor retornamos un Internal Server error un error 500 a través de este

28
00:01:46,560 --> 00:01:53,820
operador se encarga de detectar estos código de errores de la respuesta y lo encapsula dentro del erros

29
00:01:53,940 --> 00:01:58,830
acá y por supuesto dentro de esta función de flecha o expresión lambda.

30
00:01:58,920 --> 00:02:05,160
Acá lo manejamos como por ejemplo podríamos mostrar el error en la ventanita es igual de switch alert.

31
00:02:06,390 --> 00:02:08,940
Entonces acá tenemos que importar este componente.

32
00:02:15,720 --> 00:02:24,690
Perfecto, como primer parámetro, algún título para el error, por ejemplo, error al editar como segundo

33
00:02:24,690 --> 00:02:28,230
argumento el mensaje error que contiene la excepción.

34
00:02:28,380 --> 00:02:32,280
Acá el objeto error que estamos recibiendo desde el Wacken.

35
00:02:32,460 --> 00:02:34,110
Acá tenemos el atributo error.

36
00:02:34,950 --> 00:02:42,510
Este sería el atributo y acá tenemos el mensaje que fue justamente el que pasamos en el back y del tipo

37
00:02:42,990 --> 00:02:47,640
erro, para que Sual nos muestre con una ventanita de error en nuestra aplicación.

38
00:02:48,330 --> 00:02:50,520
Y tenemos que retornar el lanzamiento.

39
00:02:50,610 --> 00:02:53,280
Este error, pero en un tipo observable.

40
00:02:53,520 --> 00:02:59,220
Y para eso usamos una función que nos permite convertir este error en un observable.

41
00:02:59,370 --> 00:03:03,150
Entonces tenemos que importar acá en RX 10.

42
00:03:03,210 --> 00:03:10,530
Recordemos que acá tenemos todas las funciones para convertir o crear un observable fru error.

43
00:03:11,040 --> 00:03:16,560
Entonces acá usamos el fru error y pasamos este objeto.

44
00:03:16,680 --> 00:03:17,400
El error.

45
00:03:17,520 --> 00:03:17,730
El.

46
00:03:20,700 --> 00:03:25,740
También podríamos mostrar el error, el mensaje en la consola, en la consola del navegador.

47
00:03:32,200 --> 00:03:38,470
Recordemos que en Angular el punto y coma es opcional, mejor dicho, en ta escrita que Angular utiliza

48
00:03:38,480 --> 00:03:42,820
TypeScript como lenguaje, pero recomendable por buena práctica incluirle bien.

49
00:03:42,910 --> 00:03:44,950
Y qué faltaría, ahí estamos manejando el error.

50
00:03:44,980 --> 00:03:49,960
Pero lo ideal es que cuando ocurra, por ejemplo, si estás meditando un cliente que no existe, la

51
00:03:49,960 --> 00:03:53,410
idea es que retorne o regrese al listado cliente.

52
00:03:53,530 --> 00:03:57,820
Entonces tenemos que utilizar el router para redirigir a clientes al listado.

53
00:03:58,540 --> 00:04:00,070
Vamos a importar entonces

54
00:04:06,340 --> 00:04:11,140
import router from angular con el arroba router puntico.

55
00:04:11,260 --> 00:04:16,180
Ahora podemos inyectar en el constructor de la clase servis este objeto

56
00:04:19,960 --> 00:04:25,090
router del tipo rota y ahora con este objeto router justo al principio.

57
00:04:25,180 --> 00:04:26,890
Antes que nada ocurre error.

58
00:04:26,980 --> 00:04:27,760
Lo capturamos.

59
00:04:27,820 --> 00:04:30,010
Íbamos a redirigir al cliente.

60
00:04:36,800 --> 00:04:37,370
Perfecto.

61
00:04:37,520 --> 00:04:40,000
Vamos a guardar y estamos ok.

62
00:04:40,280 --> 00:04:41,930
Vamos a alentar primero el Wacken.

63
00:04:42,020 --> 00:04:43,370
Así que nos vamos a Eclipse.

64
00:04:51,600 --> 00:05:00,240
Y en el terminal nos vamos a la red del proyecto y levantamos con endi ser menos o para abrir el navegador.

65
00:05:06,890 --> 00:05:07,520
Acá estamos.

66
00:05:07,580 --> 00:05:14,030
Así que vamos a editar acá estaban el formulario y estamos buscando el cliente por el hasta momento

67
00:05:14,450 --> 00:05:15,110
cliente fuiste.

68
00:05:15,140 --> 00:05:18,860
Por lo tanto no hay ningún error, pero si colocamos, por ejemplo, 14.

69
00:05:20,380 --> 00:05:25,240
Y automáticamente captura el error a través del usual el error.

70
00:05:25,330 --> 00:05:29,830
Esta ventanita del tipo error el cliente y di 14 no existen.

71
00:05:30,340 --> 00:05:36,280
Justamente el error que enviamos en el piquet cuando ocurre el error y por el lado cliente lo mostramos

72
00:05:36,340 --> 00:05:37,750
redirigir amos al lithops.

73
00:05:37,750 --> 00:05:38,800
Cliente Bien.

74
00:05:38,890 --> 00:05:40,960
Y acá me comí el mensaje.

75
00:05:41,020 --> 00:05:45,580
Faltó la e vamos a guardar para que también lo muestre correctamente en la consola.

76
00:05:45,790 --> 00:05:46,510
Volvemos.

77
00:05:46,690 --> 00:05:49,350
Vamos a editar nuevamente y catos.

78
00:05:50,560 --> 00:05:54,070
Y ahora si también aparece el mensaje en la consola.

79
00:05:54,160 --> 00:05:57,100
Bien, entonces quedamos hasta acá y como siempre.

80
00:05:57,160 --> 00:05:59,200
Cualquier duda que tengan escríbela.

81
00:05:59,260 --> 00:06:00,070
Publicarla.

82
00:06:00,070 --> 00:06:02,290
La pregunta en el foro nos vemos.