Question

我有这种情况，我希望使用ngHide指令将动画应用于DOM对象：

http://plnkr.co/edit/r4i7WbCepl2w9Svv0YHn?p=preview

在这个例子中，我有这个JSON对象数组：

$scope.items = [
    {"key": 1, "values": []},
    {"key": 2, "values": [21, 22, 23]}, 
    {"key": 3, "values": [31, 32, 33, 34]}
];

此列表绑定到<ul>元素，该元素将显示此列表的键。选择它们的项目时，值应显示在具有id detailsList的另一个<div>中。将使用ng-show="selectedItem"声明显示。

根据ngAnimate的Angular文档，使用CSS添加动画：#detailsList.ng-hide。

当选择/取消选择没有值的第一个项目时，动画效果很好，但不适用于带有值的项目。

在检查detailsList元素时，我发现在动画期间没有添加钩子类：ng-hide-animate，如文档所述。

这是一个错误还是我错过了？

Answer 1

也许你可以自己写这个动画，特别是对于ngRepeat

$(function(){
$('#fill-screen').focus(function(){
    $('#fill-screen').css({'height': window.innerHeight,
                           'width':window.innerWidth});
    })
});

然后将它作为CSS类添加到ng-repeat中。

Answer 2

这是一个错误，AngularJS团队已经在1.4.4版中解决了这个问题。

检查此Git问题： https://github.com/angular/angular.js/issues/12453

使用ngHide的ngAnimate无法添加“ng-hide-animate”钩子类

2 个答案: