Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

Commit f5e0525

Browse files
committed
fix(ngAnimateSwap): make it compatible with ngIf on the same element
Previously, both `ngAnimateSwap` and `ngIf` had a priority of 600, which meant that (while both are [terminal directives][1]) they were executed on top of each other (essentially messing each other's comment node). This commit fixes it, by giving `ngAnimateSwap` a priority of 550, which is lower than `ngIf` but still higher than other directives. For reference, here is a list of built-in directive per priority: ``` -400: ngInclude, ngView -1: ngRef 1: ngMessage, ngMessageDefault, ngMessageExp, ngModel, select 10: ngModelOptions 99: ngHref, ngSrc, ngSrcset 100: attr interpolation, ngChecked, ngDisabled, ngList, ngMax, ngMaxlength, ngMin, ngMinlength, ngModel (aria), ngMultiple, ngOpen, ngPattern, ngProp*, ngReadonly, ngRequired, ngSelected, ngStep, ngValue, option 400: ngInclude, ngView 450: ngInit 500: ngController 600: ngAnimateSwap, ngIf 1000: ngNonBindable, ngRepeat 1200: ngSwitchDefault, ngSwitchWhen ``` [1]: https://docs.angularjs.org/api/ng/service/$compile#-terminal- Fixes #16616
1 parent 60997b1 commit f5e0525

File tree

2 files changed

+25
-1
lines changed

2 files changed

+25
-1
lines changed

src/ngAnimate/ngAnimateSwap.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,8 @@ var ngAnimateSwapDirective = ['$animate', function($animate) {
9292
restrict: 'A',
9393
transclude: 'element',
9494
terminal: true,
95-
priority: 600, // we use 600 here to ensure that the directive is caught before others
95+
priority: 550, // We use 550 here to ensure that the directive is caught before others,
96+
// but after `ngIf` (at priority 600).
9697
link: function(scope, $element, attrs, ctrl, $transclude) {
9798
var previousElement, previousScope;
9899
scope.$watchCollection(attrs.ngAnimateSwap || attrs['for'], function(value) {

test/ngAnimate/ngAnimateSwapSpec.js

+23
Original file line numberDiff line numberDiff line change
@@ -177,6 +177,29 @@ describe('ngAnimateSwap', function() {
177177
expect(scopeOne.$$destroyed).toBe(true);
178178
});
179179

180+
it('should work with `ngIf` on the same element', function() {
181+
var tmpl = '<div><div ng-animate-swap="exp" ng-if="true">{{ exp }}</div></div>';
182+
element = $compile(tmpl)($rootScope);
183+
$rootScope.$digest();
184+
185+
var first = element.find('div')[0];
186+
expect(first).toBeFalsy();
187+
188+
$rootScope.exp = 'yes';
189+
$rootScope.$digest();
190+
191+
var second = element.find('div')[0];
192+
expect(second.textContent).toBe('yes');
193+
194+
$rootScope.exp = 'super';
195+
$rootScope.$digest();
196+
197+
var third = element.find('div')[0];
198+
expect(third.textContent).toBe('super');
199+
expect(third).not.toEqual(second);
200+
expect(second.parentNode).toBeFalsy();
201+
});
202+
180203

181204
describe('animations', function() {
182205
it('should trigger a leave animation followed by an enter animation upon swap',function() {

0 commit comments

Comments
 (0)