使用定时器时离开页面需要清除定时器,清除的方法有两种分别针对页面有缓存和没有缓存
1、页面有缓存
2、页面没有缓存
angularjs倒计时首先需要注入:$interval
- 60s倒计时
vm.secDown = 60;//倒计时设置 vm.stopTime = $interval(getTimeDown, 1000);//将$interval放入一个实体中 //倒计时60s function getTimeDown() { if (vm.secDown > 1) { vm.secDown--; } else { $interval.cancel(vm.stopTime);//取消循环 vm.isDisplay = true; } }
- 分和秒的倒计时,下面是30分钟倒计时:29:59-----00:00
vm.MinuteDown = 29; vm.secondDown = 59; //倒计时入口 function timeCountDown() { vm.downTime = vm.MinuteDown + ':' + vm.secondDown; $interval(timeDisplay, 1000); } //计算倒计时显示 function timeDisplay() { if (vm.secondDown < 10) { vm.downTime = vm.MinuteDown + ':0' + vm.secondDown; } else { vm.downTime = vm.MinuteDown + ':' + vm.secondDown; } vm.secondDown--; if (vm.secondDown < 0) { vm.secondDown = 59; vm.MinuteDown--; } if(vm.MinuteDown==0 && vm.secondDown==0){ $interval.cancel(vm.stopTime); } }
- 总倒计时:***天***时***分***秒
//开始倒计时 vm.timer = $interval(countDownHandle, 1000); //倒计时处理方法 function countDownHandle() { angular.forEach(vm.goodsLists, function(item, index) { vm.valStart = new Date(item.startTime); vm.valEnd = new Date(item.endTime); item.dateDiff--; if (!item.dateDiff) { if (vm.todayDate.getTime() > vm.valStart.getTime()) { //即将开始 item.dateDiff = vm.todayDate.getTime() - vm.valStart.getTime(); } else if (vm.valEnd.getTime() > vm.todayDate.getTime()) { //距离结束倒计时 item.dateDiff = vm.valEnd.getTime() - vm.todayDate.getTime(); } item.dateDiff = item.dateDiff/1000; //将毫秒转为秒 } convertToTime(item);//计算秒数对应的天数、小时、分钟 }); } //将时间转换为正常显示的时间 function convertToTime(item) { //计算相差天数 vm.days = Math.floor(item.dateDiff / (24 * 3600)); //计算小时数 vm.leaveMsec1 = item.dateDiff % (24 * 3600); //计算天数后剩余毫秒数 vm.hours = Math.floor(vm.leaveMsec1 / (3600)); //计算相差分钟数 vm.leaveMsec2 = vm.leaveMsec1 % (3600 ); //计算小时数后剩余的毫秒数 vm.minutes = Math.floor(vm.leaveMsec2 / (60 )); //计算相差毫秒数 vm.leaveMsec3 = vm.leaveMsec2 % (60); //计算分钟数后剩余毫秒数 vm.seconds = Math.round(vm.leaveMsec3); //补位 item.days = vm.days < 10 ? ('0' + vm.days) : vm.days; item.hours = vm.hours < 10 ? ('0' + vm.hours) : vm.hours; item.minutes = vm.minutes < 10 ? ('0' + vm.minutes) : vm.minutes; item.seconds = vm.seconds < 10 ? ('0' + vm.seconds) : vm.seconds; console.log(item.days+'天'+item.hours+':'+item.minutes+':'+item.seconds) if (item.days == 0 && item.hours == 0 && item.minutes == 0 && item.seconds == 0) { $interval.cancel(vm.timer); } }