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-->12
    var minuts =Math.floor( (totalSeconds-days*24*60*60-hours*60*60)/60); //20.1322-->20
    var 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);