Question

我有一个页面，其中有三个图像和三个与图像对应的链接。我正在使用角度的ng-repeat来渲染图像。更改链接后，将重新排序图像。我为此创建了plunker。下面是我用过的CSS。

.my-animation.ng-move {
  -webkit-transition: 0.5s linear all;
  transition: 0.5s linear all;
}

.my-animation.ng-move {
  opacity:0.5;
}
.my-animation.ng-move.ng-move-active {
  opacity:1;
}

我使用chrome作为浏览器。我想要的只是在重新排序时的三维过渡或图像移动。我不想使用任何j-query插件。我想使用angulars animate方法。我将尝试稍后编写正确的动画，但现在问题是，当订单更改时，我无法为图像添加任何类型的动画。

只是暗示如何让动画发挥作用，或者说出我做错了什么都会有很大的帮助。

Answer 1

你的plunkr工作得很好。只有少量的东西缺失，阻止它运作良好：

您必须在模块中加入ngAnimate。如果没有，则不会显示任何动画：angular.module('home', ['ngAnimate'])。仅将它包含在您的页面上是不够的。
move表现得很奇怪。在您的情况下，它只会动画一些元素。您更愿意使用enter和leave

角动画不起作用。动画不会受到影响。

1 个答案: