angularjs - How do you animate ng-show? -


i fade out ul on ng-show=false. add css:

ul {     -webkit-transition: 2s;     transition: 2s; }  .ng-show-remove, .ng-show-add, .ng-hide-remove, .ng-hide-add {     display:block!important; }  ul.ng-hide {     opacity: .2; } 

but when ng-show set false instantly disappears. how fade out instead of instantly disappearing?

click 1 of li in fiddle demonstration.

i've attached fiddle solution.

a few things note:

the angular version included in fiddle doesn't support css animations. you'll need update 1.2 version (which requires include angular-animate.js file , nganimate module app)

var app = angular.module('foo', ['nganimate']); 

fiddle.


Comments

Popular posts from this blog

php - SPIP: From Tag directly to an article -

jquery - isAjaxRequest always return false -

ruby on rails - In a controller spec, how to find a specific tag in the generated view? -