ngRepeat动画化

Question

3

我正在通过将数组开头的元素移动，然后将其推回到末尾以制作旋转木马。从数组末尾弹出元素并将其插入到数组开头会使该元素倒回去。这很好用。但是，当我尝试进行动画时就会遇到问题。

当ng-repeat项在重复列表中更改位置时，它们应该广播'move'事件。但是，当其索引更改时，似乎只有重复列表中的某些项会触发移动事件。

请查看我的Plunker示例：http://plnkr.co/edit/PxeTeqks9sXNM4d2lE79?p=preview 当您单击“移位-推送”时，除最后一个数字外，所有数字都会发生动画效果。单击“弹出-插入”时，仅第一个数字会发生动画效果。

我认为当重复列表中的每个项目都更改了其索引时，所有项目都应该触发move事件。这是否不正确？

- mgable43

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- LordTribual · Accepted Answer

动画在Angular 1.2中发生了重大变化。如果您还没有使用1.2或更高版本，那么您应该考虑切换到它。

现在，您必须包含angular-animate.js文件，因为AngularJS的核心不再支持动画。基本上，旧的ngAnimate指令现在已经被弃用。相反，您可以使用纯CSS来实现所有动画。

对于您来说，这意味着您可以声明一些CSS样式用于.ng-enter、.ng-leave和.ng-move，以使您的ng-repeat中的项目进行动画处理。有关示例，请查看以下链接：

在此处检查Plunker示例：