This repository has been archived by the owner on Apr 12, 2024. It is now read-only.
Make ngAnimate work as closely as possible to natural CSS transitions #5646
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…the presence of className tokens
…ing class addition and removal When a CSS class containing transition code is added to an element then an animation should kick off. ngAnimate doesn't do this. It only respects transition styles that are already present on the element or on the setup class (but not the addClass animation).
…n animating on the same CSS class Closes angular#5588
ghost
assigned 
|
What's holding this back? |
|
Moved to #5749 |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
NgAnimate and natural CSS transitions are not 1-1 in terms of behaviour (yet), but this fix brings 1.2 to work alongside natural CSS transitions much better. With 1.3 the API will be changed so things are more fluid, but this fix should handle a good amount of the class-based bugs that are appearing in ngAnimate.
Long story short, if you remove ngAnimate from your application it should perform the exact same for CSS-based transitions and keyframe animations triggered by $animate.addClass and/or ngClass.
Closes #5588
Closes #5191
Here's an example of what should happen:
Natural CSS animations without ngAnimate
http://jsfiddle.net/7vk7p/3/
And this is how it is expected to be with ngAnimate
https://s3.amazonaws.com/angularjs-dev/ng-animate-race-condition-fix/example/animate.html
This is how it currently is:
http://jsfiddle.net/7vk7p/2/