The AngularJS animation module ngAnimate is separate from the AngularJS core module, so it’s necessary to include it as a dependency of your application.
The framework is already modular as of Version 1.3 and has the intention to be even more modularized with future releases. The ngAnimate module lets you animate the common directives built in AngularJS, such as ngRepeat, ngShow, ngHide, ngIf, ngInclude, ngSwitch, and ngView.
Including the ngAnimate module in the framework enables hooks that trigger animations that you want to be displayed during the normal life cycle of native directives and custom directives. For more details at Angularjs Online Training Hyderabad
AngularJS follows the convention of the configuration design paradigm, so animations can be placed using plain CSS3 animations just by following the naming conventions that will be listed later.
Animations on AngularJS are completely based on CSS classes. Animation hooks enabled by the ngAnimate module are provided by classes that are added or removed from elements in specific events. The events in which we can hook animations are the enter, move, and leave events of the DOM element and the addition or removal of a class from the element. This is a simple but powerful unique concept, as animations should be used on these events. This approach makes animations on AngularJS very intuitive without much effort or using a lot of code.
As most of these DOM manipulations are implicit in AngularJS, the animations’ approach is mainly declarative and the animation hook is not intrusive.
Animations are useful for users when they grab the user’s attention, catching the users’ eye for specific elements, and making their lives easier. The motion builds meaning about relationships between elements, functionality, and intention of the system; it enhances the user cognition.
Animations can create responsiveness when a button element is touched and clicked on and a new element is added to the view from the origin point of the button.
Animations can tell a user when an element is moved from point A to point B of the view, guiding the user’s attention. They can improve conversion; in this case, we should always use split tests.
It is easily possible to implement all the cases that I described previously using the events hooks that ngAnimate provides to us.
Article Source: http://shop.oreilly.com/product/9781783984428.do