没有 jquery/js 的点击动画

Question

嗨，我有一条丝带，里面有一排 div。如果它重叠并且您看不到所有内容，我会显示功能区左侧的箭头和功能区右侧的箭头。有了这个箭头，我可以在圆圈中无限滚动功能区（向左或向右）。

我的代码是这样的：

<div class="arrow" ng-click="list.push(list.shift())>&larr;</div>
<div class="ribbon">
    <div class="ribbonItem" ng-repeat="item in list">
        {{ item.Name }}
    </div>
</div>
<div class="arrow" ng-click="list.unshift(list.pop())>&rarr;</div>

这行得通，但它没有动画并且增加了。它还需要多次点击才能滚动浏览。如何在不使用 jquery 或 js 的情况下实现动画，而只需使用此 ng-click 即可。我尝试在我的 ng-repeat 的 css-类 ng-enter/ng-leave 上进行转换，但它不起作用：https://docs.angularjs.org/api/ng/directive/ngRepeat（查看 "Animations" ).

有人有想法吗？

谢谢。

Answer 1

类似问题：how to use animation with ng-repeat in angularjs

仔细阅读此 link 它可能会对您有所帮助： http://www.nganimate.org/angularjs/ng-repeat/move

没有 jquery/js 的点击动画

Animate ng-click without jquery/js

animation

angularjs

ng-repeat