angular / angular.js

AngularJS - HTML enhanced for web apps!
https://angularjs.org
MIT License
58.85k stars 27.52k forks source link

ngAnimate 1.4.1 causes rootScope digest/apply per element animated #12281

Closed startswithaj closed 9 years ago

startswithaj commented 9 years ago

ngAnimate inconjunction with ng-repeat causes a rootScope digest/apply per element animated.

This is the actual angular ng-repeat animation plunkr modified to demostrate the issue. You need to open inspector and view console log. Then type 'j' in the search field. When you filter down the elements and they animate you get a digest per animated row. Without the animation you get just the single digest or double digest for dirty checking.

No Animation - 2 digests happen on the rootscope level (for dirty checking) http://plnkr.co/edit/lf70ifdNEh0wftQCqmEy

Animation class on ng-repeat 8 digests happen - 1 rootscope digest per element animated http://plnkr.co/edit/l1vXyxqBYVLrOHnBc1vK

This is the easiest way to illustrate it. Is this desired behaviour? If its going to digest shouldnt it just digest the scope its in rather than do an $apply and bubble digests all the way up/down from the rootscope?

startswithaj commented 9 years ago

https://github.com/angular/angular.js/blob/071be609275558f177cdb28d8f8891bd1805af1c/src/ngAnimate/animateCss.js#L915

$timeout(onAnimationExpired, maxDelayTime + CLOSING_TIME_BUFFER * maxDurationTime);

This line is missing the third invokeApply parameter false.

$timeout(onAnimationExpired, maxDelayTime + CLOSING_TIME_BUFFER * maxDurationTime, false);

The stagger code @ https://github.com/angular/angular.js/blob/071be609275558f177cdb28d8f8891bd1805af1c/src/ngAnimate/animateCss.js#L915

Does apply the this third parameter and does not cause multiple $applys.

startswithaj commented 9 years ago

12282