AngularJS：为什么在ng-hide / show过渡期间没有附加动画类

Question

我正在尝试做一些动画工作，但由于某种原因，在ng-show / ng-hide过渡期间不会附加相应的类。我附上了这个动画，表明它们没有附加。我做错了什么？

我应该提到其他动画正在运作，例如ui-view附带的动画。

CodePen演示： http://codepen.io/anon/pen/OyoyYX?editors=101

如果您使用的是chrome，请查看调试器浏览器。您可以看到没有附加enter / etc类。

更新

GitHub上的这个案例似乎是相关的： https://github.com/angular/angular.js/issues/12267

Answer 1

这是默认的角度显示/隐藏行为。 ng-hide 类使用 display：none 来隐藏元素。但显示：无法动画。只需使用display：block和opacity：0覆盖此功能即可完成动画。 看看我改变的例子：

.ng-fluid{
    transition:1s linear all;
    opacity:1;
}
.ng-fluid.ng-hide{
  opacity:0;
  display:block;
}
.ng-hide-add, .ng-hide-remove{
  position: absolute;
}

http://codepen.io/anon/pen/LpJGwR?editors=101