mirror of
https://github.com/zhigang1992/angular.js.git
synced 2026-01-12 22:45:52 +08:00
fix(ngRepeat): preserve original position of elements that are being animated away
During the recent refactoring a typo was made that broke code that detects if we are already removed from the DOM (animation has completed). Closes #8918
This commit is contained in:
@@ -379,7 +379,7 @@ var ngRepeatDirective = ['$parse', '$animate', function($parse, $animate) {
|
||||
block = lastBlockMap[blockKey];
|
||||
elementsToRemove = getBlockNodes(block.clone);
|
||||
$animate.leave(elementsToRemove);
|
||||
if (elementsToRemove[0].parent) {
|
||||
if (elementsToRemove[0].parentNode) {
|
||||
// if the element was not removed yet because of pending animation, mark it as deleted
|
||||
// so that we can ignore it later
|
||||
for (index = 0, length = elementsToRemove.length; index < length; index++) {
|
||||
|
||||
@@ -1364,6 +1364,7 @@ describe('ngRepeat animations', function() {
|
||||
return element;
|
||||
}
|
||||
|
||||
beforeEach(module('ngAnimate'));
|
||||
beforeEach(module('ngAnimateMock'));
|
||||
|
||||
beforeEach(module(function() {
|
||||
@@ -1376,8 +1377,7 @@ describe('ngRepeat animations', function() {
|
||||
}));
|
||||
|
||||
afterEach(function(){
|
||||
dealoc(body);
|
||||
dealoc(element);
|
||||
body.empty();
|
||||
});
|
||||
|
||||
it('should fire off the enter animation',
|
||||
@@ -1445,6 +1445,42 @@ describe('ngRepeat animations', function() {
|
||||
expect(item.element.text()).toBe('2');
|
||||
}));
|
||||
|
||||
it('should not change the position of the block that is being animated away via a leave animation',
|
||||
inject(function($compile, $rootScope, $animate, $document, $window, $sniffer, $timeout) {
|
||||
if (!$sniffer.transitions) return;
|
||||
|
||||
var item;
|
||||
var ss = createMockStyleSheet($document, $window);
|
||||
|
||||
try {
|
||||
|
||||
$animate.enabled(true);
|
||||
|
||||
ss.addRule('.animate-me div',
|
||||
'-webkit-transition:1s linear all; transition:1s linear all;');
|
||||
|
||||
element = $compile(html('<div class="animate-me">' +
|
||||
'<div ng-repeat="item in items">{{ item }}</div>' +
|
||||
'</div>'))($rootScope);
|
||||
|
||||
$rootScope.items = ['1','2','3'];
|
||||
$rootScope.$digest();
|
||||
expect(element.text()).toBe('123');
|
||||
|
||||
$rootScope.items = ['1','3'];
|
||||
$rootScope.$digest();
|
||||
|
||||
expect(element.text()).toBe('123'); // the original order should be preserved
|
||||
$animate.triggerReflow();
|
||||
$timeout.flush(1500); // 1s * 1.5 closing buffer
|
||||
expect(element.text()).toBe('13');
|
||||
|
||||
} finally {
|
||||
ss.destroy();
|
||||
}
|
||||
})
|
||||
);
|
||||
|
||||
it('should fire off the move animation',
|
||||
inject(function($compile, $rootScope, $animate) {
|
||||
|
||||
|
||||
Reference in New Issue
Block a user