1
00:00:00,480 --> 00:00:04,380
En esta clase vamos a ver cómo cambiar, modificar los datos de nuestro flujo.

2
00:00:04,440 --> 00:00:09,690
Por ejemplo, si quiero convertir el nombre o el apellido, todo en mayúscula, formatea la fecha en

3
00:00:09,690 --> 00:00:10,720
un formato diferente.

4
00:00:10,850 --> 00:00:13,860
Bien, todo eso se puede hacer de diferente forma dentro de Angular.

5
00:00:13,950 --> 00:00:19,380
Básicamente lo podemos cambiar utilizando filtros o los conocidos pipe dentro de la misma vista que

6
00:00:19,380 --> 00:00:21,900
a través de un bujia helper una función.

7
00:00:22,050 --> 00:00:28,170
Podemos manipular modificar los datos del listado, los datos de litado por cada item para cambiar por

8
00:00:28,170 --> 00:00:31,140
ejemplo el nombre en mayúscula, el formato de fecha.

9
00:00:31,230 --> 00:00:31,650
En fin.

10
00:00:31,740 --> 00:00:37,320
Otra forma también es si queremos cambiar los datos a nivel de componente dentro de la clase component

11
00:00:37,410 --> 00:00:39,690
o en la clase servis dentro de flujo.

12
00:00:39,780 --> 00:00:44,130
A medida que el flujo se vaya emitiendo ahí podemos utilizar el operador MAP.

13
00:00:44,250 --> 00:00:50,160
Ya hemos visto que lo peor MAP no solo permite cambiar de un tipo de dato a otro tipo de dato, sino

14
00:00:50,160 --> 00:00:56,610
que también nos permite cambiar los datos dentro de un objeto, ya sea modificar un dato, un atributo

15
00:00:56,700 --> 00:01:00,900
o agregar valor a atributos del objeto, en este caso del objeto cliente.

16
00:01:01,080 --> 00:01:04,470
Entonces la idea es cambiar todo nombre a mayúscula.

17
00:01:04,560 --> 00:01:08,670
Lo vamos a hacer primero a nivel del observable con el operador MAP.

18
00:01:08,790 --> 00:01:09,870
Así que vamos al lío.

19
00:01:09,990 --> 00:01:11,670
Vamos a ir a clientes.

20
00:01:11,790 --> 00:01:19,110
Vamos a ir a la clase service que acá tenemos el flujo observable clientes y acá tenemos el map que

21
00:01:19,110 --> 00:01:21,180
convierte el tipo Object.

22
00:01:21,300 --> 00:01:26,400
El tipo de dato base a un tipo cliente corchete a un arreglo de cliente.

23
00:01:26,490 --> 00:01:31,890
Pero bien, no solamente quiero cambiar el arreglo clientes, sino también quiero modificar cada elemento,

24
00:01:31,890 --> 00:01:34,260
cada item de los clientes del arreglo.

25
00:01:34,960 --> 00:01:38,520
Bien, para eso tenemos que utilizar llaves en más de una instrucción.

26
00:01:42,690 --> 00:01:47,730
Lo vamos a asignar a un área de cliente con Lett.

27
00:01:47,820 --> 00:01:53,310
Es parte del lenguaje Eggman Script 6, que permite definir una variable local dentro de un método,

28
00:01:53,310 --> 00:01:54,660
por ejemplo, o una función.

29
00:01:55,620 --> 00:01:57,690
Entonces vamos a retornar los clientes.

30
00:01:59,400 --> 00:02:04,380
Recuerden que el operador MAP tiene que retornar el objeto modificado.

31
00:02:04,440 --> 00:02:06,030
Por lo tanto, tenemos que retornar client.

32
00:02:06,180 --> 00:02:09,120
Lo vamos a retornar modificando sus datos, sus valores.

33
00:02:09,150 --> 00:02:15,750
Para eso tenemos que utilizar el método Map también, pero en este caso es el método MAP del arreglo

34
00:02:15,750 --> 00:02:21,870
clientes y no del observable Hakata utilizando el operador MAP para cambiar los datos del flujo.

35
00:02:21,960 --> 00:02:23,010
Un listado clientes.

36
00:02:23,040 --> 00:02:24,960
Pero a su vez el listado de clientes.

37
00:02:25,020 --> 00:02:29,030
Un arreglo también tiene su propio map para modificar sus valores internos.

38
00:02:29,040 --> 00:02:32,130
Cada item de este array y muy parecido.

39
00:02:32,220 --> 00:02:33,030
La misma lógica.

40
00:02:34,050 --> 00:02:38,070
Pero acá como argumento va a recibir cada elemento del arreglo.

41
00:02:38,130 --> 00:02:39,410
En este caso el objeto cliente.

42
00:02:40,150 --> 00:02:41,580
Y también utilizamos las llaves.

43
00:02:41,670 --> 00:02:45,480
Entonces por cada cliente vamos a cambiar su nombre a mayúscula.

44
00:02:45,510 --> 00:02:46,470
Entonces cliente.

45
00:02:47,190 --> 00:02:48,540
Nombre igual.

46
00:02:48,660 --> 00:02:49,380
Cliente punto.

47
00:02:49,380 --> 00:02:51,480
Nombre, punto.

48
00:02:51,930 --> 00:02:52,830
Tú acerquense.

49
00:02:52,920 --> 00:02:54,390
Acá tenemos el método.

50
00:02:54,960 --> 00:02:57,600
Por lo tanto, tiene que ir con paréntesis.

51
00:02:57,690 --> 00:03:02,670
Importante agregar los paréntesis, ya que se trata de un metro y por supuesto, tenemos que retornar

52
00:03:02,760 --> 00:03:04,890
el cliente modificado.

53
00:03:07,050 --> 00:03:09,000
En este caso el cliente no clientes.

54
00:03:09,270 --> 00:03:14,160
Por lo tanto, que retornamos cada cliente del arreglo y acá retornamos el arreglo.

55
00:03:14,220 --> 00:03:21,900
Para resumir, entonces el primer botón es para el map de clientes y este segundo para el MAP para el

56
00:03:21,900 --> 00:03:24,150
operador MAP del flujo del observable.

57
00:03:24,250 --> 00:03:24,510
Bien.

58
00:03:24,570 --> 00:03:25,200
Y eso es todo.

59
00:03:25,290 --> 00:03:29,970
Ya cambiamos, modificamos cada atributo nombre de nuestro rey.

60
00:03:30,150 --> 00:03:32,670
Ahora simplemente guardamos y vamos a probar.

61
00:03:32,850 --> 00:03:38,970
Pero recuerden, tienen que levantar el servicio del Wacken de Spring y también levantar nuestra aplicación

62
00:03:39,060 --> 00:03:39,480
angular.

63
00:03:39,630 --> 00:03:40,410
Y acá lo tenemos.

64
00:03:40,500 --> 00:03:41,940
Cada nombre en mayúscula.

65
00:03:42,150 --> 00:03:43,070
Bastante simple, no?

66
00:03:43,210 --> 00:03:47,580
Y también podríamos cambiar el formato de la fecha, pero eso lo van a dejar para la próxima clase.

67
00:03:47,670 --> 00:03:49,140
Por ahora quedamos hasta acá.

68
00:03:49,260 --> 00:03:49,920
Nos vemos.