6

我试图让一个 ng-show 元素在它变得可见/隐藏时进行动画处理。但它就像一个正常的 ng-show，即显示/隐藏。

我找到了这个例子：http: //jsfiddle.net/Kx4TS/1/ 工作正常。

但是，如果我使用相同的 ng-animate 属性和相同的 css，它在我的情况下不起作用。还有什么我需要做的或动画不起作用的情况吗？

我的代码如下所示：

   <div style="" ng-show="item.hasMax()" 
     class="box" ng-animate="{show: 'fadeIn', hide:'fadeOut'}">

而CSS是：

    .fadeIn-setup,.fadeOut-setup {
          -webkit-transition: 1s linear opacity;
          -moz-transition: 1s linear opacity;
          -o-transition: 1s linear opacity;
          transition: 1s linear opacity;
        }
    .fadeIn-setup{
        opacity:0;
    }
    .fadeOut-setup{
        opacity:1;
    }
    .fadeIn-setup.fadeIn-start {
        opacity: 1;
    }
    .fadeOut-setup.fadeOut-start{
        opacity:0;
    }

另外，是否可以让 ng-animate 做 jquery slideDown / slideUp 动画之类的东西？

4

2 回答 2

5

小提琴示例使用 Angular 版本 1.1.4。确保您还有更新版本的 Angular 可用。我建议你获取最新版本。现在是 1.1.5，其中有一些重要的错误修复。

于 2013-07-04T07:10:01.693 回答
2

Angular 1.2 改变了动画方法。这是一篇解释差异的文章（ moo 发布年份）。现在更简单了——不需要 ng-animate。

于 2013-08-18T21:37:30.467 回答