Javascript Angular JS动画未调用beforeAddClass

我正在尝试使用AngJS 1.2.15创建动画

我已经定义了一个指令，其目的是创建一个post元素并将showAnswer布尔值传递给该元素

并创建了一个动画模块，如果在post元素中添加/删除了一个答案类，则会在该模块上设置动画

如果showAnswer是true/false依赖于mouseenter/mouseleave，则HTML通过将answer作为一个类分配/删除来将两者绑定在一起

HTML

<div ng-controller='MainCtrl'>

  <post class="boxWrapper answer-animation"
    ng-class="{'answer':showAnswer}"
    ng-repeat='q in questions'
    ng-mouseenter='showAnswer = true'
    ng-mouseleave='showAnswer = false'>


    <div class = 'box'>
      <div class="front jumbotron"><h1>{{q.question}}</h1></div>
      <div class="back jumbotron"><h1>{{q.answer}}</h1></div>
    </div>

  </post>
</div>

---

现在我在console.logs中显示了我期望发生的事情，但是这些日志从未被调用，这意味着beforeAddClass和beforeRemoveClass从未被调用，即使我可以清楚地看到answer类被添加到元素中！：（卡住了！

简单的事情首先，你是在向你的模块中注入

ngAnimate

吗？同时创建一个提琴或plnkr将有助于确定问题。有效（只要你将ngAnimate添加为依赖项）：老兄！我使用的是注入$animate，我想我读的博客是Anjs的旧版本！谢谢！！

app.directive('post', function() {


var controller = function($scope) {
    $scope.showAnswer = false;
  };

  return {
    restrict: 'E',
    scope: true,
    controller: controller
  }
});

app.animation('.answer-animation', function(){
  return {
    beforeAddClass: function(element, className, done){
      if (className == 'answer') {

        console.log('I am Called - ADD');

        }
      else {
        done();
      }
    },

    beforeRemoveClass: function(element, className, done) {
      if (className == 'answer') {

        console.log('I am Called - REMOVE');

        }
      else {
        done();
      }
    }
  };

});