I've got a ToDo-List style Ionic app with an <ion-list>
and <ion-item ng-repeat>
.
The <ion-items>
do have the folowing animation.css
on .ng-hide
:
-webkit-animation: flipOutX 0.3s;
animation: flipOutX 0.3s;
The animation works fine in the browser but doesn't work on devices (android/ios). When I debug the app with safari I can see that .ng-hide
with the right css is properly added - so ngAnimate seems to work alright.
I've tried using standard CSS animation (no animate.css) with all the webkits or ngFX - nothing seems to work - the animation always works in the browser but is never fired on iOS or Android.
To make it even better: It used to work on devices before I updated my setup.
EDIT: Animations do work on devices if I add them to a normal class (not .ng-hide
) - however .ng-hide
does get added to the item.
I'm at a loss! What could be the reason?
Thanks for your help!
Here is me setup:
Cordova CLI: 6.1.1
Gulp version: CLI version 3.9.0
Gulp local: Local version 3.9.1
Ionic Version: 1.2.4
Ionic CLI Version: 1.7.14
Ionic App Lib Version: 0.7.0
ios-deploy version: 1.8.5
ios-sim version: 5.0.3
OS: Mac OS X El Capitan
Node Version: v5.10.0
Xcode version: Xcode 7.3 Build version 7D175
Turns out it was a bug in the inoic bundle. See here for details: https://forum.ionicframework.com/t/angular-animations-nganimate-not-working-for-ionic-v1-2-4-angular-v1-4-3/41107/6
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.