AngularJS动画不起作用

时间:2013-10-07 08:28:07

标签: angularjs

我有一个我希望动画的列表,但它不起作用。 我正在使用angularjs 1.2.0 rc1和rc2(不是同时进行测试)。

这是我的清单:

<ul class="list-group">
    <li class="list-group-item" ng-repeat="object in logstoreList" ng-animate="'demo'">
        <a ui-sref="logstores.takelist({log : object.logstore})" ng-switch="object.subfolder">
            <span ng-switch-when="true" class="badge">-</span>
            <span ng-switch-default class="badge">+</span>
        {{object.extname}}
        </a>
    </li>
</ul>

和CSS-Content:

.demo-enter {
   -webkit-transition: all 1s linear;
   transition: all 1s linear;
   background: #000;
}

.demo-enter.demo-enter-active {
   background: #fc3;
}

我错过了什么吗?

1 个答案:

答案 0 :(得分:2)

ng-animate在1.2.0中已弃用。

看看这里:http://www.johnpapa.net/preparing-for-animations-in-angular-1-2-0

编辑以详细说明:

您拥有的代码在1.1.4 / 1.1.5中可以正常工作。

在1.1.4 / 1.1.5中,你可以使用ng-animate指令来定义'enter','leave'动画的前缀。您现在在1.2.0+中所拥有的是该指令不再存在,并且所有“enter”和“leave”动画始终使用“ng-leave”和“ng-enter”类。和其他角度动画的命名相同。