AngularJS: ngAnimate randomly fails on IE10

Question

Using AngularJS 1.2.1 I have a page with 7 separate ngSwitchs and ngAnimates on them so they look like left-right sliders with each switch-on being one full row. The content slides in from right or left controlled by buttons. As I said, there are 7 of these sliding rows, all of which are inside one controller.

Everything works well in every browser I have tried but IE10. Here the animates work on random ngSwitches. Some animate, some just re-display as if there was no animation. Every refresh is different, sometimes none work, sometimes (though rarely) all do.

This seems like some sort of timing problem with each switch being filled in by separate REST get from the server. I have been unable to duplicate this in a Plunkr due to the service.get.

ngAnimate relies on changing the classes in the switch during the animations. Obviously I have the animations defined properly since they work fine everywhere else. Since ngAnimate changes the classes automatically during the animation I can't have messed that up.

Is this a known problem with ngAnimate? Is there a work-around?

Answer 1

As I added the version number I realized I should check for the latest and indeed this seems to be fixed in 1.2.13. If you try to animate too quickly after page load, it may not work but eventually the code catches up and all rows work correctly.