Aprendiendo Ngrx Signal Store - Angular

[@ddgutierrez]

Hola Saludos! Una consulta. Excelente video de antemano! Muchas gracias por el contenido y por el video! Consulta sobre la mutación de objetos en el Store con Signals y Computed Tengo la siguiente situación con el manejo de objetos en un store en Angular, usando Signals y el nuevo @for. A continuación, describo el escenario: 1. El store es inyectado en el componente padre. 2. Desde el padre, itero una lista de objetos que obtengo del store a través de un computed, por ejemplo: @for (objeto of store.listaObjetos(); let i = $index; track i) { } 3. El componente hijo recibe cada objeto a través de un input signal, y dentro del hijo, tengo un campo de entrada que vincula el objeto recibido con ngModel, como en el siguiente ejemplo: El flujo observado: 1. El componente padre inyecta el store y distribuye los objetos a los componentes hijos. 2. El hijo recibe el objeto mediante el input signal. 3. Cuando se realiza un cambio en el input, noto el siguiente flujo que sucede completamente automatica: 3.1. El cambio en el input del hijo se propaga. 3.2. El cambio pasa por el padre. 3.3 Finalmente, el objeto en el store se actualiza directamente en su atributo nombre. Mi duda principal: Tengo dudas sobre si este comportamiento es correcto o si hay algún error en la implementación de los Signals o en mi comprensión de su funcionamiento. Mis observaciones: Según lo que entiendo, los computed deberían retornar un deep clone (una clonación profunda) de los objetos del store, para evitar que los cambios que realice un componente o donde sea que se consuma y se realice un cambio. Estos se propaguen directamente al store a través de referencias. Es decir, debería devolver una copia del objeto y no una referencia, lo cual impediría que los cambios se propaguen al store automáticamente. Mis preguntas son las siguientes: 1. No es cierto que el store solo debería ser mutado mediante el método patchState dentro de los withMethods? 2. ¿No debería ser el store el único responsable de mutar sus propios datos, sin permitir que estos sean modificados desde otros componentes de manera automática? Lo que he intentado hasta ahora: Para evitar que los cambios se propaguen automáticamente al store, realicé una clonación profunda del objeto retornado por la señal computada en el componente padre (osea el componente encargado de inyectar el store). Esto lo hice directamente en el componente quien consume el store y que usa el computed signal que retorna la lista, ya que hacerlo desde el store perdería la reactividad necesaria para notificar a los suscriptores. De esta forma, los cambios no se propagan automáticamente al store a través del ngModel a menos que yo llame explícitamente al método definido en withMethods que utiliza patchState. Mi duda final: A pesar de esta solución temporal, no estoy seguro de si este es el enfoque correcto. Me preocupa que esté malinterpretando la forma en que las Signals deberían funcionar o si mi implementación está incorrecta. Agradecería mucho si alguien pudiera explicarme en detalle cuál es el comportamiento esperado de las Signals en este contexto y cómo debería manejar correctamente la mutación de los datos en el store.

[@cristophersaraosverdugo5934]

Que buena explicación ❤

[@felipemendietaz4947]

Gracias por el contenido Kevin. Excelente.

[@jmd3v]

¡Gracias! excelente explicación 🤓

[@JoseQR]

Gracias por este gran contenido

[@andresmauriciofajardoolaya2721]

si no estoy mal, las propiedades que se definen en el initial state ya tienen sus propios selectores, por lo que, no haría falta volver a hacer el computed de esa prop

[@MarcialSoto]

hola estimado, en primer lugar muchas gracias por la información. Una consulta, como resuelves para el tema de la paginación cuando agregas un elemento nuevo al store. Me explico, cuando tienes en tu apliación los primeros 10 elementos que traes del servidor y agregas o quitas uno, que pasa con el store cuando eso sucede? Espero haberme hecho entender y gracias por tu tiempo.

[@enriqueruiz320]

🤩

[@oscarbravoarrieta3704]

Gracias por el vídeo. Está excelente. Me Aclaraste dudas respecto al tema. Puedes ayudarme por favor, diciéndome de que forma es posible sincronizar lo que se almacene Signals Store con el localStorage y poder así lograr la persistencia de los datos, de tal forma que estos se mantengan incluso si cambio de pestaña o inclusive si pulso la tecla F5 en el navegador. Gracias de antemano.

[@marcelovizcarra188]

Hay una librería llamada 'ngrx-local-storage' que te ayuda justamente con eso, sincroniza tu store o parte de él automáticamente con el local storage.