angularjs - angular ng-animate directive with ng-show directive -

i cant ng-animate work ng-show directive. here jsbin simplified example:

http://jsbin.com/uquzal/1/edit

for reason css classes .show-animation-setup , .show-animation-start not working. ideas? thanks!

you need running angularjs version 1.1.4 or newer, 1.1.5 being latest right now. need use different set of css rules — they've changed since first release.

updated jsbin

modify html point 1.1.5:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script> 

and change css rules use .show-animation setup , .show-animation.show-animation.active active animation:

.show-animation {   background-color:red;   -webkit-transition:all linear 0.5s;   -moz-transition:all linear 0.5s;   -ms-transition:all linear 0.5s;   -o-transition:all linear 0.5s;   transition:all linear 0.5s;   opacity: 0; }  .show-animation.show-animation-active {   background: blue;   opacity: 1; } 

also please note, if testing under firefox, have found there bug animations inconsistently applied. think it's fixed in trunk, not yet available on release branch.