CanDeactivate Guard in Angular Router (2021)
Decoded Frontend
View ChannelAbout
Decoded Frontend is a source of advanced, in-depth, and pragmatic video tutorials about Angular and Web Development. Every second Tuesday I publish a new video focusing on really advanced topics and tricks that might kick off your carrier and help you to quickly grow from Middle to Senior level. If you already have some experience with the Angular framework and you are bothered by shallow videos made mostly for beginners - then you are at the right place. Consider subscribing to my channel and I promise that you will not be disappointed! My name is Dmytro Mezhenskyi, I am a Google Developer Expert in Angular and I will be happy to share my 12 years of experience in Web Development with you. Thanks for your attention and see you in my next video 👋 For any questions, collaboration or suggestions please reach me at [email protected]
Latest Posts
Video Description
Before I start to explaining CanDeactivate Router Guard in Angular I would like to ask you if you have 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) 📣 https://bit.ly/angular-material-theming-workshop ✅ Use 10%-off coupon code: YOUTUBE_DISCOUNT (Only 2 coupons left) 📣 Blazing fast GraphQL Backend just in 1 Day with Hasura Engine 📣 https://bit.ly/complete-hasura-course ✅ 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: https://github.com/DMezhenskyi/angular-router-guards-example #angularrouter #routerguards #candeactivate #webdevelopment #angulartip
No Recommendations Found
No products were found for the selected channel.