简单的ng-show动画不起作用



我正在尝试从Angularjs文档复制NG-Show动画

<div class="v3-account-form animate-show-hide" ng-show="thing.shown">
   <h3>{{thing.id}}</h3>
</div>

CSS:

.animate-show-hide.ng-hide {
  opacity: 0;
}
.animate-show-hide.ng-hide-add,
.animate-show-hide.ng-hide-remove {
  transition: all linear 0.5s;
}
.v3-account-form {
  border: 1px solid black;
  opacity: 1;
}

但是动画在这里不起作用是小提琴。http://jsfiddle.net/ffkty/527/

您没有在小提琴ngAnimate中导入。正如您在Angular Plunker中看到的那样,有必要使Ngshow动画起作用。

<script src="//code.angularjs.org/snapshot/angular.min.js"></script>
<script src="//code.angularjs.org/snapshot/angular-animate.js"></script>

最新更新