计时器在0:0

时间:2016-08-04 10:58:12

标签: javascript angularjs timer

我有一个指令,我计算计时器倒计时如下

<div stop-watch name="candidateInfo.name" time-of-interview="candidateInfo.dateOfInterview" class="stop-watch"></div>

    'use strict';
angular.module('iSourcingApp.tpModule')
    .directive('stopWatch', function($state) {
        return {
            restrict: 'A',
            replace: false,
            scope: {
                name: "=",
                timeOfInterview: "=",
                onSend: '&',
                startInterview:'&',
                viewPage:"="
            },
            controller: function($scope, $interval) {debugger
                $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() {
                        $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.timeOfInterview);
                        }
                    }
                    $scope.updateClock();
                    $scope.timeinterval = $interval($scope.updateClock, 1000);
                }
                $scope.initializeClock($scope.timeOfInterview);
            },
            templateUrl: function() {
                var tpl = $state.current.name;
                return './tpModule/views/' + tpl + '.html';
            }
        };
    });

但是在这里我无法停止计时器,虽然倒数达到0

这里timeOfInterview在ng-repeat中,t[$scope.name]我用来将不同的计时器绑定到不同的候选者。

以下是绑定

的模板示例
<div ng-show="viewPage" class=" btn active interview-timer" ng-click="startInterview();onSend()">
<p>Interview Starts in
    <span class="days" ng-bind="t[name].days"></span>:
    <span class="hours" ng-bind="t[name].hours"></span>:
    <span class="minutes" ng-bind="t[name].minutes"></span>:
    <span class="seconds" ng-bind="t[name].seconds"></span>
</p>

感谢任何帮助。

1 个答案:

答案 0 :(得分:1)

我认为你应该致电

search.input = search.form.find('.search-input')

而不是

$interval.cancel($scope.timeinterval);