Angularjs Ng animate不添加Ng enter和Ng leave类

这是我第一个使用Angular的项目，我在使用ng animate时遇到了一些问题。我做了几个教程，在教程中，我让一切都很顺利。现在我正在为一个项目使用Angular，但我无法让ng animate正常工作。诸如“ng enter”和“ng leave”之类的类不会添加到不同的元素中

我将各种工作脚本与我的进行了比较，但就是找不出我做错了什么

我的标题：

<link rel="stylesheet" href="css/app.css">

<script src="js/libraries/jquery-2.1.1.min.js"></script>
<script src="js/libraries/angular.js"></script>
<script src="js/libraries/angular-animate.js"></script>
<script src="js/libraries/angular-resource.js"></script>
<script src="js/libraries/angular-route.js"></script>

<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>

My controllers.js：

'use strict';

/* Controllers */

var engineShowcaseController = angular.module('engineShowcaseController', []);

engineShowcaseController.controller('MainCtrl', function ($scope, Main) {
    $scope.pageclass = "page-home";
    $scope.hotspots = Main.query();
});


  engineShowcaseController.controller('ChapterCtrl', function ($scope, $routeParams, Main) {
    $scope.pageclass = "page-chapter";
      $scope.chapter = Main.get({ chapterID: $routeParams.chapterID });
  });

第一页/主页的HTML：

<div 
    ng-repeat="hotspot in hotspots" 
    class="hotspot hotspot-{{hotspot.id}}" 
    data-nextup="chapter-{{hotspot.id}}" 
    data-startframe="{{hotspot.startFrame}}" 
    data-endframe="{{hotspot.endFrame}}">

    <a  href="#/chapters/{{hotspot.chapterID}}">
        {{hotspot.label}}
    </a>
</div>

如果我是正确的，类为“热点”的div应该会收到“ng enter”和“ng leave”类。。。但不知怎的，他们没有

有人能帮我解决这个问题吗？我做错了什么？

---

非常感谢

结帐时您应该支付以下几项费用：

你没有提到你使用的是angular上的哪个版本。与1.2版不同，动画的工作方式也不同。有一篇很好的文章是关于：

另外，ng animate的理念是对CSS类的添加和删除进行计时，因此实际的动画应该由CSS定义（您没有提供，因此很难找出错误）

此外，“实际”动画是发生

ng leave.ng leave active

和

ng enter.ng enter active

的地方。你可以在这篇文章中了解更多

下面是一个非常简单的例子，它应该给你一个领先的开始：

---

如果使用1.2版中的Angular，则必须声明CSS类动画 对于要设置动画的元素，请在模块中插入“ngAnimate”

var-app=angular.module（'myApp'，['ngAnimate']）
.element.ng-enter{
过渡：所有线性500ms；
不透明度：0；
}
.element.ng-enter-active{
不透明度：1；
}
.5.5.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2{
过渡：所有线性500ms；
不透明度：1；
变换：translate3d（0,0,0）；
}
.element.ng-left-active{
不透明度：0；
变换：translate3d（100px，0，0）；
}
动画在哪里定义？好问题！忘了提那部分。为了进行测试，我使用了一个相当简单的
.ng enter{border:1px solid red；}
，所以在“输入”时，它应该显示一个红色边框，但它没有（我甚至尝试添加了！重要的是确保它不会被否决）。你解决了问题吗？没有，没有找到解决方案：（断开的链接）
'use strict';

/* Controllers */

var engineShowcaseController = angular.module('engineShowcaseController', []);

engineShowcaseController.controller('MainCtrl', function ($scope, Main) {
    $scope.pageclass = "page-home";
    $scope.hotspots = Main.query();
});


  engineShowcaseController.controller('ChapterCtrl', function ($scope, $routeParams, Main) {
    $scope.pageclass = "page-chapter";
      $scope.chapter = Main.get({ chapterID: $routeParams.chapterID });
  });

<div 
    ng-repeat="hotspot in hotspots" 
    class="hotspot hotspot-{{hotspot.id}}" 
    data-nextup="chapter-{{hotspot.id}}" 
    data-startframe="{{hotspot.startFrame}}" 
    data-endframe="{{hotspot.endFrame}}">

    <a  href="#/chapters/{{hotspot.chapterID}}">
        {{hotspot.label}}
    </a>
</div>