Question

在AngularJS 1.2+中，使用ngAnimate，通过动画逐个显示项目列表非常容易。

但是，我在将相同的方法应用于嵌套数组时遇到了一些麻烦。

我们说我有一个3x3 2d数组：

$scope.matrix = [
    [{a: 1,b: 2}, {a: 1,b: 2}, {a: 1,b: 2}],
    [{a: 1,b: 2}, {a: 1,b: 2}, {a: 1,b: 2}],
    [{a: 1,b: 2}, {a: 1,b: 2}, {a: 1,b: 2}]
];

和html显示这个带有嵌套ng-repeat的二维数组：

<ul>
  <li ng-repeat="row in matrix ">
    <ul>
      <li  class="animate-repeat" ng-repeat="entry in row track by $index">{{entry.a}}/{{entry.b}}</li>
    </ul>
  </li>
</ul>

最后ngAnimate css 每秒逐个淡入每个条目：

.animate-repeat.ng-enter-stagger {
    transition-delay: 1000ms;
    transition-duration: 0s;
}
.animate-repeat.ng-enter {
    transition: 1000ms ease-in all;
    opacity: 0;
}
.animate-repeat .ng-enter-active {
    opacity: 1;
}

这在我测试时不起作用：http://plnkr.co/edit/BaPTL33b2y1ITIb7uZuy?p=preview

我假设当前版本的AngularJS不会为内部转发器自动添加ngAnimate类，这是正确的吗？

如果是这样，是否有解决问题的方法/解决方案，那么我可以用动画逐个显示二维数组中的每个项目？（不要压扁2d阵列。）

感谢。

AngularJS 1.2：是否可以在嵌套转发器中使用ngAnimate？

0 个答案: