angularjs:ngAnimate不工作

我对angularjs是新手。我正在用rails尝试angularjs（使用“angularjs rails”gem）。我使用ngAnimate有困难。该功能工作正常，即angular安装正确，“addEntry”功能将新条目相加，但动画不起作用。我不确定我在这里错过了什么

app = angular.module("MyApp", ['ngAnimate'])

@MainCtrl = ($scope) ->
  $scope.entries = [{name: "Dummy1"}, {name: "Dummy2"}]

  $scope.addEntry = ->
    $scope.entries.push({name: "Dummy3"})

以下是html文件：

<div ng-controller="MainCtrl">
  <button ng-click="addEntry()"></button>
  <div ng-repeat="entry in entries" ng-animate="'demo'">
    <a>{{entry.name}}</a>
  </div>
</div>

---

如果需要淡入淡出动画，请在“设置”类中将“不透明度”设置为0，在“活动”类中将“不透明度”设置为1

.animate-enter {
    -webkit-transition: 1s linear all; /* Chrome */
    transition: 1s linear all;
    opacity: 0;
}

.animate-enter.animate-enter-active {
    opacity: 1;
}

---

ng animate

属性在1.2中被弃用，不再使用。相反，动画现在是基于类的

如果你想让你的ng repeat enter Animation命名为“demo”，你必须按照一个特殊的命名约定，用一些额外的类来修饰它：

.demo.ng-enter {
  transition: all linear 500ms;
  opacity: 0;
}

.demo.ng-enter-active {
  opacity: 1;
}

然后将“demo”类放在包含ng repeat的元素上：

<div ng-repeat="entry in entries" class="demo">

演示：

---

关于这个主题的好消息来源：

这与动画效果无关，问题是它不支持动画。顺便说一句（据我所知），当我们使用ng animate=“'animate'”时，您在答案中提到的样式应该有效。明白了！非常感谢塔塞卡特的帮助。：）

<div ng-repeat="entry in entries" class="demo">