Cómo prevenir la pérdida accidental de información en tus rutas de Angular gracias a canDeactivate.

Описание: En este video vemos cómo utilizar la guarda canDeactivate del Router de Angular para prevenir la posible perdida accidental de información que se puede producir al abandonar una ruta. Para ello utilizaremos una aplicación con un formulario en la que usaremos la guarda para solicitar una confirmación en el caso de que haya cambios sin guardar.

Lista de contenido
00:00 Intro.
00:23 Qué es y para qué sirve la guarda canDeactivate.
vvv Parte Práctica vvv
01:33 Vista General de la Aplicación
02:09 Crear la guarda y asignarla a la ruta
02:52 Estructura y funcionamiento básico de la guarda.
03:52 Implementación básica de la lógica.
05:51 Implementación reutilizable usando interface.
07:16 BONUS: window:beforeunload
09:05 Outro

Comandos de la CLI.
ng generate guard [nombre] --guardType CanDeactivate --functional


Enlaces de interés.
📋 Código Fuente: https://github.com/ako-tech/canDeacti...

🔗 CanDeactivateFn: https://angular.io/api/router/CanDeac...
🔗 window:beforeunload: https://developer.mozilla.org/en-US/d...



💲 Si deseas apoyar la creación de más contenido de este tipo, puedes hacerlo a través de:
▶ Paypal: https://www.paypal.com/donate/?hosted...
▶ El botón [♥ Gracias] situado cerca del botón de 👍en el video.

---

twitter:   / _akotech  
github: https://github.com/ako-tech