Question

我正在使用ng-animate，我有一个使用ng-repeat迭代的条目列表。当您对特定条目进行选择时，它会消失。我已正确定义.ng-move, .ng-move-active, .ng-leave, .ng-leave-active，以便在对数据执行.leave操作时发生.splice()动画，并在重新排序条目时发生.move操作。

但是，我想要的是当其中一个条目被删除时，.ng-leave会在该条目上发生.ng-move，而.splice()将它们全部滑动。我发现.ng-move不会触发.splice()，所以我很好奇是否有办法在<div data-ng-repeat="entry in data" class="container card-drop card-shift"> <card data="entry"></card> </div>之后强制播放动画？

这是html：

.card-drop.ng-leave {
    transition: 0.5s ease-in-out;
    opacity: 1;
}

.card-drop.ng-leave.ng-leave-active {
    transform: scale(0.5);
    opacity: 0;
}

.card-shift.ng-move {
    transition: 0.5s ease-in-out;
}

.card-shift.ng-move.ng-move-active {
    transform: translateY(-284px);
}

以下是css类：

$scope.data.splice(index, 1);

在javascript中，我关注的事件只是.ng-leave

编辑：http://plnkr.co/edit/nz38XxPbV4Ycqdn3QYVP?p=preview

以上是我所指的问题的内容。请注意，当您单击某个条目并进行拼接时，会出现ng-move动画，但__nw__FUi __walkback __dl__FPv个动画都没有。

Answer 1

解决方案是没有简单的方法来做到这一点。最终，我最终在指令中操纵DOM元素的CSS以提供滑动动画，然后在拼接的同时瞬间将它们移动到原始位置，从而产生我所追求的动画，尽管是以一种黑客的方式。 / p>

如何在拼接后触发ng-move？

1 个答案: