我刚开始使用Angular JS作为我的Web应用程序 .
我有一个使用 <div ng-repeat="item in items">...</div>
呈现的对象列表 . 使用对服务器的ajax调用填充 $scope.items
列表 .
我的模块注入了ngAnimate,如下所示
var myApp = angular.module('myModule',['ngAnimate','infinite-scroll']);
用户可以选择添加/删除项目 . 当用户添加/删除项目时,我希望相应的模型分别淡入/淡出 . 我已经按照this link来实现上面提到的效果 . 但是,在页面加载时,项目中的所有模型都会淡入,而不仅仅是在使用 $scope.items.push({item-x:item-value})
添加新项目时 . 我希望淡入效果仅适用于新添加的项目 .
此外,当在滚动(无限滚动)时将新项目推送到列表时,项目再次淡入 .
这可以使用html元素上的 ng-class
指令来实现吗?
任何帮助实现这一点将不胜感激 . 谢谢
1 回答
您可以使用
$animate.enabled(/* boolean */)
全局禁用动画 . 所以,如果您想在初始加载项目期间暂时关闭动画,您可以这样:Demo
请注意,
$timeout
是重新启用(并且必须注入控制器)所必需的,以便使其正常工作 .你可以使用相同的方法与ngInfiniteScroll一起使用 - 只要你愿意就把它关掉 . 只需确保在完成要禁用动画的事件后再将其重新打开 .