angularjs - 我怎样才能只在 ng-views 上使用 ng-animate 而不是 ng-repeats？

Question

当使用带有 ngAnimate 模块的 Angular 1.2 时，它在 ng-views 上运行良好，但它也适用于 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 的优秀文章：）