[ngAnimate] enter animation not working with ngClass

[mgcrea]

Looks like there might be some bug with ngClass animations (enter animation does not work).

<a ng-repeat="item in items" class="list-group-item" ng-class="'animation-fade'">

Is not working.
Works if I switch ngClass with class.

Plunker: http://plnkr.co/edit/8UrtBtMee9mE88o1qMwh?p=preview

[mgcrea]

Ended up using a custom ngView decorator, looks like an important regression from 1.1.x.

Maybe there is another way to achieve dynamic animations?
Any ideas @gsklee, @matsko?

[matsko]

Hey @mgcrea yes I am aware of this issue. What happens is that for some reason the browser thinks the transition is ongoing for the element when the first animation class is added. Then a 1ms reflow happens and the active class is added so the element doesn't go to the original start state at all and just sits around in the active state. So it looks like nothing animated. I have this fixed in a branch and this may help with your previous issue. The new PR that this will be apart of will fix ngClass as well so hopefully today or tomorrow it will be up.

[mgcrea]

Ok great, thanks @matsko.
Let me know if you want me to test it once ready.

[matsko]

@mgcrea can you please test using this build:
https://s3.amazonaws.com/angularjs-dev/enter-leave-animate-bug/angular.js
https://s3.amazonaws.com/angularjs-dev/enter-leave-animate-bug/angular-animate.js

[mgcrea]

@matsko Looks like the ngClass issue is fixed!
http://plnkr.co/edit/H5aiJz3xT6XbVbdwbdnQ?p=preview