ng-animate在我的IONIC应用程序中不起作用
我是新来的。我尝试在本教程中添加动画：
http://gonehybrid.com/how-to-animate-your-ionic-app-with-animate-css-and-nganimate/
所有的工作都很好，直到nganimate步骤。我不知道为什么，但是如果我像这个例子一样添加一个自定义类，什么都不会发生。这是我的代码(附注：我没有编辑我的app.js。ng-animate包含在Ionic中，对吧？)：
<ion-content has-bouncing="false">
<a class="whiteBack" />
<div class="staffList">
<a class="item item-avatar animate patate">
<img src="https://cdn4.iconfinder.com/data/icons/general04/png/256/clients.png">
<h2>Stefano Z.</h2>
<p>iOS & Android App Developer</p>
</a>
</ion-content>CSS：
/*animation*/
patate.ng-enter {
-webkit-animation: fadeInLeft 1s;
animation: fadeInLeft 1s;
} 可能我在index.html中遗漏了一些东西：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="css/animate.css" rel="stylesheet">
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="http://code.ionicframework.com/0.9.23/js/angular/angular-animate.min.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
</head>
<body ng-app="starter">
<ion-nav-view></ion-nav-view>
</body>
</html>回答 3
Stack Overflow用户
发布于 2016-02-29 22:30:57
ng-animate包含在Ionic框架中，只需要应用animated类，它应该出现在动画效果之前，即：class="animated fade-in-out"
所以可能是这样的：
<a class="item item-avatar animate patate">应该是：
<a class="item item-avatar animated patate">Stack Overflow用户
发布于 2017-03-12 12:16:33
您可以像这样添加"ng-animate-children“属性：
<body ng-app="starter" ng-animate-children="true">
详情请访问：https://docs.angularjs.org/api/ngAnimate/directive/ngAnimateChildren
Stack Overflow用户
发布于 2017-06-13 14:30:50
Ionic在ng-animate (Bug)方面有很多问题。尝试使用angular1.3.0和Ionic1.3.2
https://stackoverflow.com/questions/35364917
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号