Question

我在指令中有以下内容......

部分

<div class="row-animate" ng-repeat="item in test">

JS

scope.test = [{name:"test start"}];
scope.addNew = function(){
  scope.test.push({name:"Test other"});
}

动画很棒。现在我有另一个列表，它被控制器填充，然后通过数据绑定传递给我的指令...

scope: {
  items: '='
}
<div class="row row-animate" ng-repeat="item in items | orderBy : sortColumn : sortDescending"
         ng-init="itemOrdinal = $index;"
         ng-class="{'even-item': ($index%2), 'odd-item': !($index%2)}">

问题是这个只是加载我看不到动画。任何人都可以看到任何明显的错误吗？

更新

CSS

.row-animate {
  color:green;
  &.ng-enter {
    -webkit-animation: fadeIn 10s;
    -moz-animation: fadeIn 10s;
    -ms-animation: fadeIn 10s;
    animation: fadeIn 10s;
  }

  &.ng-leave {
    -webkit-animation: fadeOut 1s;
    -moz-animation: fadeOut 1s;
    -ms-animation: fadeOut 1s;
    animation: fadeOut 1s;
  }
}

Answer 1

确保您的依赖项中有`ngAnimate'模块，并且加载了js / css文件，因为它们未包含在angularjs核心中。 {安装'下的https://docs.angularjs.org/api/ngAnimate。

角动画的麻烦

1 个答案: