ng-show animation works not as expected

Question

I have created this pulnker . Both enter an leave animation are not working well...
The enter- first appears and then animation kicks in.
The leave- just wont animate.

Here is the style:

   div.ng-enter 
   {
    -webkit-animation: bounceIn 2s;
    animation: bounceIn 2s;
   }
   div.ng-leave 
   {
     -webkit-animation: bounceOut 2s;
    animation: bounceOut 2s;
   }

And here is the element node:

<div ng-show="show" ng-class="{true:'ng-enter', false: 'ng-leave'}[show]">asdasdas</div>

Any help would be appreciated!

Answer 1

There were a few changes in 1.2.0 rc1 re-plunkered

class="repeat-item"

and the enter/leave are assumed css

.repeat-item.ng-enter, 
.repeat-item.ng-leave {...}

here's more details from yearofmoo

Here is the plunker for ng-show: http://plnkr.co/edit/0hHjG4RQ3tQngwd814Tg?p=preview