Video details

#Angular Router Guards Pt.1: CanDeactivate (2021)


#angularrouter #routerguards #candeactivate #webdevelopment #angulartip Have you ever had a situation when you filled out some complex form and incidentally moved away from it before the data was saved? Do you remember that terrible feeling when you realise that the data you entered is gone? This is an example of bad UX and CanDeactivate Router Guard is a solution which can help your users to avoid this situation. In this video you will see how to combine your CanDeactivate guard with Angular Material Dialog and how to make the guard reusable. Thanks you for your attention and enjoy watching!
📣 Become a Pro in Angular Material Theming (Advanced Workshop) 📣 ✅ Use 20%-off coupon code: HELLO-SUMMER-2021
📣 Blazing fast GraphQL Backend just in 1 Day with Hasura Engine 📣 ✅
20%-off coupon code: HASURA-EASY-START
Time Codes: 00:00:00 - Intro; 00:00:28 - What is CanDeactivate Guard; 00:01:13 - Use-case for CanDeactivate Guard; 00:02:30 - Intro to the initial Project; 00:03:47 - What we are going to implement? 00:04:38 - Let's implement a basic CanDeactivate Guard; 00:12:27 - Bind CanDeactivate with Material Confirmation Dialog; 00:19:01 - Refactor the Guard to make it reusable; 00:25:08 - Outro;
🔗 Link to the source code on GitHub: