javascript - ng-repeat 和动画的 AngularJS 问题

Question

我对 ng-repeat 中的动画有疑问。

通过更改集合中的数据，动画适用于所有新元素，但不适用于现有元素。即使价值观发生了变化。

例如：

第一个状态

1. 元素“香蕉”
2. 元素“苹果”
3. 元素“菠萝”

第二状态

1. 元素“梨”——没有动画
2. 元素“葡萄柚”——没有动画
3. 元素“橙色”——没有动画
4. 元素“草莓”——动画作品
5. 元素“奇异果”——动画作品

HTML：

    <li ng-repeat="elements in topicList" class="negative {{elements.class}} topic-list">
        <a ng-click="navigateTopic({{$index}})" href="" class="{{elements.icon}}">{{elements.name}}</a>
    </li>

CSS：

.topic-list.ng-enter,
.topic-list.ng-leave,
.topic-list.ng-move {
    -webkit-transition: all 300ms;
    -moz-transition: all 300ms;
    -o-transition: all 300ms;
    transition: all 300ms;
}

.topic-list.ng-enter,
.topic-list.ng-move {
    margin-left: 330px !important;
}

.topic-list.ng-move.ng-move-active,
.topic-list.ng-enter.ng-enter-active {
    margin-left: 0 !important;
}

.topic-list.ng-leave {
    margin-left: 0 !important;
}

.topic-list.ng-leave.ng-leave-active {
    margin-left: -330px !important;
}

JS（改变集合）

[…]
$scope.topicList = newVals;
[…]

感谢您的任何想法！