angularjs - AngularJS - CSS3 高度动画（自动） - 有时有效

Question

我想为一个元素设置动画，但我不知道实际高度，这就是我使用trickwith的原因max-height。

CSS非常简单：

.animate-enter-setup, .animate-leave-setup {
  transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
  overflow: hidden;
}

.animate-enter-setup {
  opacity:0;
  max-height: 0;
}
.animate-enter-setup.animate-enter-start {
  max-height: 200px;
  opacity:1;
}

.animate-leave-setup{
  opacity:1;
  max-height: 200px;
}
.animate-leave-setup.animate-leave-start {
  opacity:0;
  max-height: 0;
}

在此处的示例中： http ://plunker.co/edit/AoirGQoOKsflunxj9RGVleave ?p=preview仅在项目未完成上一个动画时才应用动画获取enter。当项目完成enter动画时，leave动画不会被应用（它作为一个类，但没有视觉效果）。

我怀疑 CSS 有问题而不是角度问题。但我不知道那会是什么。

Answer 1

事实证明，如果你想使用这个max-height技巧，那么你想要动画的元素必须已经定义max-height并且overflow:hidden（不仅在动画类上）

这里奇怪的是setup动画类即使在元素上也不会被浏览器应用。

更新示例：http ://plunker.co/edit/qnEFDhAyGqhsJdCGrF71?p=preview

我认为这可能是角度或铬的错误。