Skip to content

Commit b52f9df

Browse files
committed
fix($animate): permit class-based animations for leave operations if ngAnimateChildren is enabled
Prior to this fix, $animate.leave placed a disabled animation on the element which prevented ngAnimateChildren from properly working. This patch now addresses that issue. Closes angular#8092
1 parent 74a214c commit b52f9df

File tree

2 files changed

+57
-2
lines changed

2 files changed

+57
-2
lines changed

src/ngAnimate/animate.js

+1-2
Original file line numberDiff line numberDiff line change
@@ -826,7 +826,6 @@ angular.module('ngAnimate', ['ng'])
826826

827827
cancelChildAnimations(element);
828828
classBasedAnimationsBlocked(element, true);
829-
this.enabled(false, element);
830829
return runAnimationPostDigest(function(done) {
831830
return performAnimation('leave', 'ng-leave', stripCommentsFromElement(element), null, null, function() {
832831
$delegate.leave(element);
@@ -1350,7 +1349,7 @@ angular.module('ngAnimate', ['ng'])
13501349
//the element did not reach the root element which means that it
13511350
//is not apart of the DOM. Therefore there is no reason to do
13521351
//any animations on it
1353-
if (parentElement.length === 0) break;
1352+
if (parentElement.length === 0) { break; };
13541353

13551354
var isRoot = isMatchingElement(parentElement, $rootElement);
13561355
var state = isRoot ? rootAnimateState : (parentElement.data(NG_ANIMATE_STATE) || {});

test/ngAnimate/animateSpec.js

+56
Original file line numberDiff line numberDiff line change
@@ -4820,6 +4820,62 @@ describe("ngAnimate", function() {
48204820
expect(spy).toHaveBeenCalled();
48214821
expect(spy.callCount).toBe(1);
48224822
}));
4823+
4824+
it('should permit class-based animations when ng-animate-children is true for a structural animation', function() {
4825+
var spy = jasmine.createSpy();
4826+
4827+
module(function($animateProvider) {
4828+
$animateProvider.register('.inner', function() {
4829+
return {
4830+
beforeAddClass : function(element, className, done) {
4831+
spy();
4832+
done();
4833+
},
4834+
beforeRemoveClass : function(element, className, done) {
4835+
spy();
4836+
done();
4837+
}
4838+
};
4839+
});
4840+
});
4841+
4842+
inject(function($animate, $sniffer, $rootScope, $compile) {
4843+
4844+
$animate.enabled(true);
4845+
4846+
var html = '<div ng-animate-children>' +
4847+
' <div class="inner" ng-class="{animate:bool}">...</div>' +
4848+
'</div>';
4849+
4850+
var element = angular.element(html);
4851+
$compile(element)($rootScope);
4852+
var body = angular.element($document[0].body);
4853+
body.append($rootElement);
4854+
4855+
$rootScope.$watch('bool', function(bool) {
4856+
if (bool) {
4857+
$animate.enter(element, $rootElement);
4858+
} else if(element.parent().length) {
4859+
$animate.leave(element);
4860+
}
4861+
});
4862+
4863+
$rootScope.$digest();
4864+
expect(spy.callCount).toBe(0);
4865+
4866+
$rootScope.bool = true;
4867+
$rootScope.$digest();
4868+
$animate.triggerReflow();
4869+
$animate.triggerCallbacks();
4870+
expect(spy.callCount).toBe(1);
4871+
4872+
$rootScope.bool = false;
4873+
$rootScope.$digest();
4874+
$animate.triggerReflow();
4875+
$animate.triggerCallbacks();
4876+
expect(spy.callCount).toBe(2);
4877+
});
4878+
});
48234879
});
48244880

48254881
describe('SVG', function() {

0 commit comments

Comments
 (0)