Question

使用ngAnimate，我想设置一个仅在解析$ resource返回数据时显示的元素的动画。到目前为止，我已经尝试过：

<h3 ng-show="data.$resolved" class="animate-show">My Devices: {{deviceList.length}}</h3>

但是元素会弹出视图而不是在解析数据时淡入。

如果我更改下面的标记，我可以通过切换复选框来淡化元素。

<h3 ng-show="showMe" class="animate-show">My Devices: {{deviceList.length}}</h3>
  <input type="checkbox" ng-model="showMe"/>

可能是什么问题？

Answer 1

我对动画有完全相同的问题。我做的是：

当我获得数据时，我使用$ timeout

将节目延迟到下一个周期

data.$promise.then(function() {
    $timeout(function () { $scope.showMe = true; }, 0);
});

这样浏览器就有时间渲染动画了。我不知道究竟是什么，但我的猜测是Angular保持一个脏循环来检查更改（是的，它做了什么），以便尽可能快地触发对视图的绑定。因此，延迟到下一个周期将为浏览器留出一些动画时间。