angularJS自定义指令-毫秒级倒计时

//js代码

app.register.directive("dirGroupTime",GroupTime);
function GroupTime($controller,$interval){
    return{
        restrict:'E',
        replace:true,
        transclude:true,
        scope:{
            bindTime:'@bindTime'
        },
        template:'::{{s}}.{{ms}}',
        link:function(scope,$element,attr){
            var timer;
            //监听时间
            var watcher=scope.$watch("bindTime",function(n){
               timer=$interval(upDate,100);
               console.log(n)
            });

            function upDate(){
                var endTime=scope.bindTime;
                var nowTime=new Date();
                var countDown=endTime-nowTime.getTime();
                if(countDown<=0){
                    $interval.cancel(timer);
                    scope.h=0;
                    scope.m=0;
                    scope.s=0;
                    scope.ms=0;
                }else{
                    var h=parseInt(countDown/1000/3600);
                    var m=parseInt(countDown/1000%3600/60);
                    var s=parseInt(countDown/1000%3600%60);
                    var ms=Math.floor(countDown%1000/100)

                    scope.h=h<10?"0"+h:h;
                    scope.m=m<10?"0"+m:m;
                    scope.s=s<10?"0"+s:s;
                    scope.ms=ms;
                }
                
            }
        }
    }
}

html代码:传入结束时间

 

你可能感兴趣的:(angularJS自定义指令-毫秒级倒计时)