angularjs exclude certain elements from animations

2019-09-03 06:10发布

问题:

I'm using ngAnimate in some places but it's taking over animations for all my ng-class elements. I already had substantial animations code written for various elements that I don't need ngAnimate to take over. Their adding classes really seems to mess things up. Anyway to exclude those elements?

Here's the element I'm trying to exclude:

<div ng-class="myclass"></div>

ngAnimate adds classes like

$scope.myclass = 'move'

<div class="move-add" ng-class="myclass"></div>

回答1:

I was helped by jaawerth on IRC. He/she directed me to this link:

https://github.com/angular/angular.js/issues/5172

and advised me to write this directive:

.directive('noAnimate', ['$animate',
  function($animate) {
    return {
      restrict: 'A',
      link: function(scope, element, attrs) {
        $animate.enabled(false, element)
        scope.$watch(function () {
          $animate.enabled(false, element)
        })
      }
    };
  }
])

Which solved the problem.