angularJs实现倒计时效果

angularJs实现倒计时效果

在angularJS中有一个内置对象为$interval(函数，时间间隔，[运行次数])

有两种使用方式

方式一：

$scope.timesStr=10;
$interval(function () {$scope.timesStr--;
},1000,10);

方式二：

$scope.timesStr=5;
var times = $interval(function () {if($scope.timesStr==0){// 取消定时器$interval.cancel(times);}else{$scope.timesStr--;}
},1000);

实现时间倒计时效果：

此方法添加在回调函数中

var totalSeconds = Math.floor((new Date($scope.entity.endTime).getTime() - new Date().getTime())/1000);
// .getTime是获取到的毫秒值，需要通过计算来进行真实时间的显示，但是由于在计算的时候会产生小数点，所以需要进行向下取整（Math.floor）
$interval(function () {$scope.timeStr="";var days = Math.floor(totalSeconds/60/60/24);  //13.5233---13天var hours =Math.floor( (totalSeconds-days*24*60*60)/60/60); //12.234545-->12var minuts =Math.floor( (totalSeconds-days*24*60*60-hours*60*60)/60); //20.1322-->20var seconds = totalSeconds-days*24*60*60-hours*60*60-minuts*60;if(days<10){days="0"+days;}if(hours<10){hours="0"+hours;}if(minuts<10){minuts="0"+minuts;}if(seconds<10){seconds="0"+seconds;}if(days==0){$scope.timeStr+=hours+":"+minuts+":"+seconds;}else{$scope.timeStr+=days+"天 "+hours+":"+minuts+":"+seconds;}totalSeconds--;
},1000,totalSeconds);

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！