AngularJSは、私は$私のディレクティブでアニメーション使ってクラスを追加したいディレクティブ

Question

をアニメーション：

app.directive('animTest', [ '$animate', function($animate) { 
    return function(scope, element, attrs) { 
    element.on('click', function() { 
     if(element.hasClass('clicked')) { 
     console.log('[remove]'); 
     $animate.removeClass(element, 'clicked'); 
     } else { 
     console.log('[add]'); 
     $animate.addClass(element, 'clicked'); 
     } 
    }); 
    }; 
}]); 

CSS：

.clicked { 
    background: red; 
} 
.clicked-add, .clicked-remove, .clicked-add-active, .clicked-remove-active { 
    -webkit-transition: all linear 0.5s; 
    transition: all linear 0.5s; 
} 

しかし、クラスが追加されることはありません。

UPDATE - 追加plnkr：https://plnkr.co/edit/zczgsnLuXONfU8U5mIuv - ログのみそれぞれに '[追加]'

Answer 1

 element.on('click', function() { 
     if(element.hasClass('clicked')) { 
      scope.$apply(function(){ 
      console.log('[remove]'); 
      $animate.removeClass(element, 'clicked'); 
      }) 

     } else { 
      scope.$apply(function(){ 
      console.log('[add]'); 
      $animate.addClass(element, 'clicked'); 
      }); 
     } 
     }); 

をクリックして、あなたはより多くの詳細についてはthis answerを確認することができます。