为什么我只能在ng-view上使用ng-animate，而不能使用ng-repeats？

Question

当将Angular 1.2与ngAnimate模块一起使用时，它在ng-view上工作得很好，但它也适用于ng-repeats。并且当有大量数据时，排序后会对性能造成相当大的影响。

有没有办法不让ng-repeats变得活灵活现？我已经尝试过在控制器中使用ng-animate，但它似乎必须在应用程序级别加载，然后才能应用于所有应用程序。

Answer 1

我所做的就是在更改控制器中的列表之前使用$animate.enabled( false )，并在不久之后通过$timeout重新启用它。

Answer 2

ng-animate将仅基于类进行动画制作，尝试为动画制作唯一的类，并仅将其应用于您的案例中需要它们的位置。

例如：

<div ng-init="items=['a','b','c','d','e','x']">
  <input placeholder="filter" ng-model="f" />
  <div ng-repeat="item in items | filter:f" class="repeat-item">
    {{item}}
  </div>
</div>

然后，在为该ngRepeat项定义实际的CSS动画代码时，CSS选择器代码如下所示：

.repeat-item.ng-enter,
.repeat-item.ng-leave {
  -webkit-transition:0.5s linear all;
  -moz-transition:0.5s linear all;
  -o-transition:0.5s linear all;
  transition:0.5s linear all;
}

.repeat-item.ng-enter,
.repeat-item.ng-leave.ng-leave-active {
  opacity:0;
}
.repeat-item.ng-leave,
.repeat-item.ng-enter.ng-enter-active {
  opacity:1;
}

(摘自YearOfMoo优秀的新ng-animate：)