Angular Animations Tutorial: Disable and Enable Animations

I’m willing to bet, that if you’ve spent very much time working with Angular animations, you’ve had the need or desire to disable them for one reason or another. Something that I encounter quite a bit are animations that run on component initialization. I have animations that I only expect to run when an interaction occurs, or when data changes, or something along those lines. I don’t expect them to run on initialization, but they do anyway. Well, this is something that I’m going to show you how to fix in this video. Alright, let’s get to it.
------------------------------------------------------------------------------
📺 More Angular Animation Tutorial Videos:
1.) Learn the Basics ( • Angular Animations Tut... )
2.) Enter & Leave Animations ( • Angular Animations Tut... )
3.) The Keyframes Function ( • Angular Animations Tut... )
4.) Query and Stagger Functions ( • Angular Animations Tut... )
5.) Parallel Animations ( • Angular Animations Tut... )
6.) Animating to an Unknown Height ( • Angular Animations Tut... )
8.) Creating Reusable Animations ( • Angular Animations Tut... )
------------------------------------------------------------------------------
💖 Help Support the Channel:
If you found this helpful and want to show some love, you can always buy me a coffee (buymeacoffee.com/briantreese)!
------------------------------------------------------------------------------
🔗 Demo Links:
- Before (stackblitz.com/edit/stackblit...)
- After (stackblitz.com/edit/stackblit...)
------------------------------------------------------------------------------
📖 Chapters:
0:00 - Introduction
1:09 - The demo application
2:12 - Disabling animations with the disabled animation control binding
4:33 - Animation callback events with disabled animations
6:17 - Conclusion
------------------------------------------------------------------------------
#angular #angular_developer #angulartraining #javascript #typescript #frontend #angularcourse #animation