动态改变进入/离开动画类名答案

【问题标题】：Dynamically change enter/leave animation class name动态改变进入/离开动画类名
【发布时间】：2017-07-28 07:44:31
【问题描述】：

我有 ng-repeat，我想根据控制器 (vm) 中的变量更改进入/离开动画。我发现了这个（http://www.nganimate.org/），但它适用于角度 1.1.5，我使用的是 1.5。我怎样才能做到这一点？谢谢！

【问题讨论】：

标签： angularjs angularjs-directive angularjs-ng-repeat angular-animations

【解决方案1】：

只需在您的样式表中创建一些动画类，然后根据您喜欢的vm 中的任何变量通过ng-class 切换它们。以下可能是您的标记：

<ul>
  <li ng-repeat="item in vm.items track by item.id"
      ng-class="{
        'animation-1-class': vm.varOfYourChoice,
        'animation-2-class': !vm.varOfYourChoice
      }"
  ></li>
</ul>

还有你的样式表：

.animation-1-class.ng-enter,
.animation-1-class.ng-leave.ng-leave-active { ... }

.animation-1-class.ng-leave,
.animation-1-class.ng-enter.ng-enter-active { ... }

.animation-2-class.ng-enter,
.animation-2-class.ng-leave.ng-leave-active { ... }

.animation-2-class.ng-leave,
.animation-2-class.ng-enter.ng-enter-active { ... }

而here 是有关您正在使用的 AngularJs 版本的角度动画的相关文档。

【讨论】：

【解决方案2】：

问题是，如果我创建与 animation.css 同名的 css，animation.css 总是会接管，所以我只是在我的类中添加一个前缀，它解决了这个问题。

【讨论】：