扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
本文主要设计定时器的三种循环,模板自配,下面分享给大家供大家参考,具体如下:
专注于为中小企业提供成都做网站、网站设计、外贸营销网站建设服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业杭锦后免费做网站提供优质的服务。我们立足成都,凝聚了一批互联网行业人才,有力地推动了上千企业的稳健成长,帮助中小企业通过网站建设实现规模扩充和转变。
1、$interlval实现,比较简单和原生js的setInterval比较相似
var app = angular.module('myApp',[]); app.run(function($rootScope , $interval){ var img=["http://hdn.xnimg.cn/photos/hdn321/20130612/2235/h_main_NNN4_e80a000007df111a.jpg" ,"http://ww2.sinaimg.cn/crop.0.0.1080.1080.1024/d773ebfajw8eum57eobkwj20u00u075w.jpg","/upload/otherpic70/74735.jpg"] var i = 0; var timer = $interval(function(){ if(i >= img.length){ i = 0; } $rootScope.imgSrc = img[i++]; },1000) });
2、$timeout的递归调用来实现
app.run(function($rootScope,$timeout){ var img=["http://hdn.xnimg.cn/photos/hdn321/20130612/2235/h_main_NNN4_e80a000007df111a.jpg" ,"http://ww2.sinaimg.cn/crop.0.0.1080.1080.1024/d773ebfajw8eum57eobkwj20u00u075w.jpg","/upload/otherpic70/74735.jpg"] var i = 0; $rootScope.c = 0; var loop = function(){ $timeout(function(){ if(i >= img.length){ i = 0; } $rootScope.imgSrc=img[i++]; loop(); $rootScope.c += 1; },2000) }; loop(); })
3、$timeout借助arguments.callee来实现
app.run(function($rootScope,$timeout){ var img=["http://hdn.xnimg.cn/photos/hdn321/20130612/2235/h_main_NNN4_e80a000007df111a.jpg" ,"http://ww2.sinaimg.cn/crop.0.0.1080.1080.1024/d773ebfajw8eum57eobkwj20u00u075w.jpg","/upload/otherpic70/74735.jpg"] var i = 0; $rootScope.c = 0; var loop = function(){ $timeout(function(){ if(i >= img.length){ i = 0; } $rootScope.imgSrc=img[i++]; loop(); $rootScope.c += 1; },2000) }; loop(); })
更多关于AngularJS相关内容感兴趣的读者可查看本站专题:《AngularJS入门与进阶教程》及《AngularJS MVC架构总结》
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对创新互联的支持。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流