O'Reilly logo

Learning AngularJS Animations by Richard Keller

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

AngularJS animation with CSS transitions

We need to know how to bind the CSS animation we learned about in Chapter 2, Understanding CSS3 Transitions and Animations, as well as the AngularJS directives listed in the previous table. The ngIf directive, for example, has support for the enter and leave animations.

When the value of the ngIf model is changed to true, it triggers the animation by adding the ng-enter class to the element just after the ngIf DOM element is created and injected. This triggers the animation, and the classes are kept for the duration of the transition. Then, the ng-enter class is removed. When the value of ngIf is changed to false, the ng-leave class is added to the element just before the ngIf content is removed from the ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required