如何使用Ang-Show 1.3 beta版的ng-show淡入和淡出DIV的可见性？

我的代码看起来像这样:

   xxx

我知道AngularJS中的动画有很多变化.有人能告诉我最简单的方法是让它显示500ms显示,并在数值变化时隐藏xxx 50ms.请注意,我使用的是最新的AngularJS.

参考angular-animate.js

将ngAnimate添加为依赖模块:

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

选择转换的名称,例如'fade',然后根据文档中描述的命名约定定义适当的CSS类:

.fade.ng-hide {
  opacity: 0;
}

.fade.ng-hide-remove,
.fade.ng-hide-add {
  display: block !important; /* or inline-block, as appropriate */
}

.fade.ng-hide-remove {
  transition: all linear 1000ms;
}

.fade.ng-hide-add {
  transition: all linear 500ms;
}

将类添加到元素:

演示: http ://plnkr.co/edit/HWi0FfDOsHeSOkcrRtN2？p =preview

我无法得到已接受的工作答案,但以下工作(主要来自这个ng-nuggets帖子):

.fade {
    transition: all linear 500ms;
    opacity: 1;
}

.fade.ng-hide {
    opacity: 0;
}

然后我想要淡入淡出的HTML元素看起来像这样:

some text here

正如@MichaelNguyen所提到的,Bootstrap似乎确实已经调用了一个样式fade,我们在我们的应用程序中使用了Bootstrap,但上述样式仍然有效.如果已经有一个已命名的样式fade,则在使用上述代码之前将名称更改为唯一的名称.