AngularJS与ng-repeat和动画有关的问题

Question

我在ng-repeat中遇到动画问题。

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

例如：

第一个州

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

第二个状态

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

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;
[…]

感谢您的任何想法！