According to several blogs, this should work.
<li ng-animate="{enter: 'animated shake'}" ng-repeat="name in names | filter:search">
<a href="#"> {{name}} </a>
</li>
Add a comment
|
1 Answer
Since angular 1.2, ngAnimate works differently.
See Matsko's article.
To get it working, you ony have to add specific class in your css. Example for ngIf directive :
.myItem.ng-enter {
// animation
}
.myItem.ng-leave {
// animation
}
For using Animate.css with angular >= 1.2, you can read this article, example here.
.my-element.ng-enter {
animation: fadeIn 1s;
}
.my-element.ng-leave {
animation: fadeOut 1s;
}
6 Comments
nilskp
So we can no longer do animation without going into CSS and using AngularJS specific classes?
meriadec
Right. The goal was to not use 'presentation based' directives in your html code. It's css job.
meriadec
This one is only a css-class toggle based on
ngClick. ngAnimate is used for animating automatically ngIf, ngShow, ngRepeat etc. directives.nilskp
So
ng-animate is now deprecated. Seems like they've made it harder to integrate third-party animation libs, like animate.css. Not a good decision for non-CSS guys like me.meriadec
Nope!
ngAnimate still works (and is much better), and you still can use Animate.css. Look at the bottom of my answer ! :) |