Animation logic triggering an unnecessary $rootScope.$digest if ng-if is present

[poshest]

In this Plunker, there's a $scope.$apply() because of the ng-click as expected. But then, follows an $evalAsync which calls another, I would argue unnecessary $rootScope.$digest().

It seems to happen because of the presence of the ng-if in

<b ng-if="toggle">toggled</b>

And only happens when toggle evaluates to false, removing the element.

It doesn't happen if the ng-if is changed to ng-show. It seems to be caused by some core Angular animation functionality, involving functions like $$AnimateAsyncRunFactoryProvider, whose waitQueue appears to originate the $evalAsync. I'm not sure what fed the waitQueue in the first place. Although there is animation code involved, this problem occurs whether or not ng-animate is included.

It seems to have appeared in the 1.4.x series. No extra digest happens using v1.3.20.

This is causing many additional digest cycles in my app that I would love to not have.

[Narretz]

Even if ngAnimate isn't included, Angular uses the same API for actions that may or may not have animations. And this API is async.
That doesn't mean the additional digest is necessary - this needs some further investigation

[Narretz]

So ngIf is using a then promise success handler to do some cleanup to the DOM once the element has been removed (this must be done after an animation runs, and the code must be async even if no animation exists). It's possible that we could use the done function for this, which works like then but doesn't use / create a promise. I'm not sure about the implications, though.

[gkalpak]

👍 on using .done instead. Since there is already a digest in progress and the extra digest is only for clearing some internal state (previousElements = null), there shouldn't be any implications (famous last words 😁).

[poshest]

Wonderful stuff! Thank you @Narretz, @gkalpak :)

[poshest]

Thank you @Narretz :)