scope is destroyed too early for ngView and ngInclude causing ngClass not to update

[matsko]

A popular animation trick is to perform a back and forward-style animation in using ngClass on a ngView or ngInclude element. This used to work with older versions of ngAnimate (pre 1.2) since ngAnimate didn't use CSS classes for animations.

Right now if you try and perform an animation that, when the route changes, updates ngClass and triggers the leave animation to be different, it won't reflect on the leaving element. This is because ngView and ngInclude both destroy the scope first and then trigger the animation. However, since an extra digest is required for a class to update via ngClass upon routeChange, the newly updated CSS classes won't show up in the element.

Therefore, we need to fix ngView and ngInclude to destroy the scope after a single digest loop via $$postDigest or something.

Dupes: #7515

[btford]

@matsko please triage your own issues. 😄

[IgorMinar]

was this always an issue or is this a regression?

[mhevery]

Sounds like we need to delay removal until after digest.

[matsko]

The problem came from here: https://groups.google.com/forum/#!topic/angular/iKpRhrPr8ko

[matsko]

@IgorMinar always an issue once we started to rely on class="..." to detect animations.

[IgorMinar]

btw $destroy is now quite destructive. it even blows away $asyncEval and $$postDigest queues.

[IgorMinar]

+1 for what @btford said. please triage this issue so that others don't have to do it, you already understand the issue and can label it within a few seconds while others have to read and try to understand it.