-
Notifications
You must be signed in to change notification settings - Fork 27.5k
$animate.addClass difficulties and / or glitches #5620
Comments
@matsko can you please take a look? |
Fixing #5588 first since it introduced three strange bugs with ngShow/ngHide and $animate. It might put a dent into this one when fixed. Almost done with that one. |
Here's the working version of your code -- without a flicker: http://plnkr.co/edit/IHrPITen0MGijczkx7vL?p=preview. I agree that the ngShow/ngHide restrictions do make things difficult. Let's resume once the other issue out of the way. |
ahh, I had tried many different combinations, I guess I missed that one. Might be useful to show an example of this in the ngShowHide docs |
Just fixed #5588. It doesn't fix or relate to your issue. But your CSS code for the original example is incorrect. Let me explain why. when the page loads
when the show animation runs
when the hide animation runs
So just an incorrect use of the classes. I agree that the class-based animations are complicated to use and should be much better documented. They could also be changed around in 1.3 or 2.0, but the docs are more important at the moment. Closing this issue. |
http://plnkr.co/edit/CGgL13QsEwnwv9D1shG1?p=preview is an example of the reason for this --- it's very hard to have different animations for the showing and hiding of the content, and causes some glitches.
For my use case, I don't want to remove nodes from the DOM, so ng-switch or ng-if are not really applicable (it's important, otherwise I end up losing playback position of media content).
If there's a way to get the $animate.addClass behaviour to behave similarly to $animate.enter/leave, that would be great.
I'm not totally sure where to poke at that though, and it's entirely possible that I'm getting this wrong due to not being a CSS guru. But if there is a good way to do this for addClass, it should probably be included in the documentation.
Let me know if I'm being a complete idiot here :> This issue probably only really applies to ngShow/Hide, due to their use of the ng-hide class which seems to cause this issue.
The text was updated successfully, but these errors were encountered: