角度ng重复，重新排序动画幻灯片

Question

我有一个有角度的旋转木马滑块，我有{-1}}的重复次数，当我点击下一个幻灯片按钮时，id会改变它。

看看我的JSFiddle here

我有使用ng-repeat的div：

orderBy:'id'

我可以对新项目列表进行排序：

<div class="slide" ng-repeat="slide in slides | orderBy:'id*1'">
    <p>
      {{ slide.value.name }}
    </p>
</div>

我的问题：

首先发生动画，然后范围新的订购项目并闪烁到新幻灯片。有任何想法吗？如何在$scope.nextSlide = () => { let items = $scope.slides let countItems = items.length for (let i = 0; i < countItems; i++) { let z = items[i].id % countItems; items[i].id = z + (countItems - 1); } } 中动画重新排序？

Answer 1

为什么不首先重新排序，以便第一张幻灯片处于“正常”顺序，当您点击下一步时，“重新排序”幻灯片会显示...

我只是不明白为什么你会在“next（）”

上重新排序

Answer 2

我认为你正在以错误的方式解决问题，关于你的动画。 假设您总共可以看到2个项目。 1 | 2 | 3 | 4

当您点击下一步时，它应该：   - 左侧滑动（动画）   - 那么，一旦完成动画，你可以：
  - 重新排序项目（后面的第2个）和 - 同时 - 重新列入列表。

我认为在您的小型演示中，您只是忘记重新输入列表。 我想这一切都取决于你做动画的方式。