ngAnimate 不会动画转换

Question

我正在写作，应用程序和 ngAnimate 在某个时候停止工作。我正在尝试调试它并将我的应用程序缩减为这个非常小的示例，其中在按下按钮时除了动画之外什么都没有发生。尽管如此，我还是不知道为什么它不起作用。我正在按预期注入 ngAnimate，并且我还有脚本标签来包含源代码。

var searchApp = angular.module('searchApp', ['ngAnimate'])

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

谁能看出我做错了什么？这一定是一些非常明显的事情，因为应用程序现在非常简单...花了几个小时试图看到它。

Answer 1

问题出在您的 CSS 上，而不是 Angular。

Here's a working version

问题一是 .testiDiv .ng-hide 在这种情况下无效，这意味着您期望 .ng-hide 在 [=13= 之内] 而不是在上面。

问题二是动画放错了class，应该跟动画有关classes Angular automatically applies on elements using ng-show / ng-hide.

.testiDiv {
  background-color: black;
  width: 100px;
  height: 100px;
  opacity: 1;
}

.testiDiv.ng-hide {
  opacity: 0;
}

.testiDiv.ng-hide-add, .testiDiv.ng-hide-remove {
  -webkit-transition:all 1s linear;
    -moz-transition:all 1s linear;
    -o-transition:all 1s linear;
    transition:all 1s linear;
}

ngAnimate 不会动画转换

ngAnimate doesn't animate transitions

angularjs

ng-animate