ng-leave removes the item when transition of a child element is finished

[bzzz-dmg]

I'm submitting a ...

• [x] bug report
• [ ] feature request
• [ ] other (Please do not submit support requests here (see above))

Current behavior:

ng-leave removes item too early, when some of the child elements finishes its transition

Expected / new behavior:

Items are not removed before ng-leave transition is finished.

Minimal reproduction of the problem with instructions:

Demo: https://plnkr.co/edit/pwDJA6s6ZJvfeJKiRjWk?p=preview In the first list items are removed only after child transition is finished, so it works as expected. In the second list items are removed a bit earlier so that child transition ends before ng-leave transition which leads to termination of ng-leave transition and removes the item.

Here is a workaround for this particular problem: https://plnkr.co/edit/0Xwe0JWfx5wmVRfDJi2i?p=preview It cancels transition of child element, but it have to work without such hacks.

AngularJS version: 1.6.6

Browser: [Chromium 60 | Chrome 60 | Firefox 55]

Anything else:

I'm not sure how it works exactly, but transition time should probably be determined only on the item ng-leave is applied on, not anything else.

[Narretz]

Hi, thanks for the report. I think the problem is that our transitionend event listener does not work correctly when the event is coming from a child element. (https://github.com/angular/angular.js/blob/3651e42e49ded7d410fd1cbd46f717056000afd4/src/ngAnimate/animateCss.js#L804-L829) I think we should simply ignore all of the event in this case. I'll work on a test case and PR.

[Narretz]

Here's a plunker with a fix: https://plnkr.co/edit/nKU8lkiwVI6kphL99G6J?p=preview And here's the PR https://github.com/angular/angular.js/pull/16214

[bzzz-dmg]

Looks good, thank you.

[Narretz]

Fix will be in the 1.6.7 release (commit https://github.com/angular/angular.js/commit/1391e99c7f73795180b792af21ad4402f96e225d)