angularjs - ngAnimate 不在 ng-repeat 上添加动画类

Question

我包含了 angular-animate.js:

<script src="bower_components/jquery/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/sass-bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/lodash/dist/lodash.compat.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>

并将其添加为依赖项:

angular.module('myApp', [
  'ngRoute',
  'ngAnimate'  
])

我创建了一个 ng-repeat 列表:

<li ng-repeat="result in search.results" class="movie-list__item list-animation">
  ...        
</li>

并定义了.list-animation:

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

.list-animation.ng-enter.ng-enter-active {
  opacity: 1;
}

为什么它不起作用？ ngAnimate 似乎没有将动画相关的类放入任何元素中。

AngularJS: 1.2.6 Angular 动画:1.2.9

Answer 1

<li ng-repeat="result in search.results" class="movie-list__item list-animation">

应该是

<li ng-repeat="result in search.results" class="movie-list__item list-animation" ng-animate>