当计时器达到<时显示div。 00:00

时间:2016-08-05 07:02:26

标签: javascript angularjs angularjs-directive

我有一个场景,我需要在计时器总值为<时显示div。 0 这是指令代码:

angular.module('iSourcingApp.tpModule')
.directive('stopWatch', function($state) {
    return {
        restrict: 'A',
        replace: false,
        scope: {
            name: "=",
            timeOfInterview: "=",
            onSend: '&',
            startInterview: '&',
            viewPage: "="
        },
        controller: function($scope, $rootScope, $interval) {
            debugger
            $rootScope.showDiv = {};
            $scope.getTimeRemaining = function(endtime) {
                $scope.t[$scope.name].total = Date.parse(endtime) - Date.parse(new Date());
                $scope.t[$scope.name].seconds = Math.floor(($scope.t[$scope.name].total / 1000) % 60);
                $scope.t[$scope.name].minutes = Math.floor(($scope.t[$scope.name].total / 1000 / 60) % 60);
                $scope.t[$scope.name].hours = Math.floor(($scope.t[$scope.name].total / (1000 * 60 * 60)) % 24);
                $scope.t[$scope.name].days = Math.floor($scope.t[$scope.name].total / (1000 * 60 * 60 * 24));
            }
            $scope.initializeClock = function(endtime) {
                debugger
                $scope.t = {};
                $scope.t[$scope.name] = {};
                $scope.updateClock = function() {
                    debugger
                    $scope.getTimeRemaining(endtime);
                    $scope.t[$scope.name].hours = ('0' + $scope.t[$scope.name].hours).slice(-2);
                    $scope.t[$scope.name].minutes = ('0' + $scope.t[$scope.name].minutes).slice(-2);
                    $scope.t[$scope.name].seconds = ('0' + $scope.t[$scope.name].seconds).slice(-2);
                    if ($scope.t[$scope.name].total == 0) {
                        console.log($scope.t[$scope.name].total);
                        $interval.cancel($scope.timeinterval);
                        $rootScope.showDiv[$scope.name] = true;
                        alert("Start interview for " + $scope.name);
                    } else {
                        if ($scope.t[$scope.name].total < 0) {
                            $interval.cancel($scope.timeinterval);
                            $rootScope.showDiv[$scope.name] = true;
                        }
                    }
                }
                $scope.updateClock();
                $scope.timeinterval = $interval($scope.updateClock, 1000);
            }
            $scope.initializeClock($scope.timeOfInterview);
        },
        templateUrl: function() {
            var tpl = $state.current.name;
            return './tpModule/views/' + tpl + '.html';
        }
    };
});

如果是$scope.t[$scope.name].total < 0,那么我将showDiv设置为true,当它为真时,我会显示div

<div ng-show="showDiv[candidateInfo.name]" class="col-xs-offset-4 showDiv">
            <p class="timer-text">The interview for {{candidateInfo.name}} has crossed scheduled time</p>
            <div class="row showDiv" >
                <a class="timer-text col-xs-3" style="cursor:pointer" ng-click="fnReschedule(candidateInfo.name, candidateInfo.recruiter)"><i >reschedule</i></a>
                <a class="timer-text col-xs-3" style="cursor:pointer" ng-click="fnStartInterview(candidateInfo.name,candidateInfo.presentRound,candidateInfo.askedQuestions,candidateInfo._id,candidateInfo.dateOfInterview)"><i class="text-center">start interview</i></a>
            </div>
        </div>

所以,这里发生的事情最初会显示一些模板,并在一秒左右后显示div 但是如果计时器是&lt;最初我不需要显示模板。 0

并且不同候选人的计时器不同

任何帮助都将不胜感激。

0 个答案:

没有答案