Hi all,

We are going to implement count-up timer. In Count up timer, timer starts from 00:00:00 to time you defined. It is used to show duration for example video duration , call duration , etc

In Html file , Just add binding variable in you code like:-

.
.
. 
<div ng-controller='TimeCtrl'>
    <p>{{ clock}}</p>
</div>
.
.
.

Now you Javascript file , defined this function as :-

function TimeCtrl($scope, $timeout) {
    $scope.clock = "loading clock..."; // initialise the time variable
    $scope.tickInterval = 1000 //ms
		$scope.ti = 0
    var tick = function() {
    		$scope.ti++;
        var hr = (Math.floor($scope.ti/3600)<10)?("0" + Math.floor($scope.ti/3600)):(Math.floor($scope.ti/3600));
        var min = (Math.floor($scope.ti/60)<10)?("0" + Math.floor($scope.ti/60)):(Math.floor($scope.ti/60));
        var sec = $scope.ti%60<10?("0" + $scope.ti%60):($scope.ti%60);
        $scope.clock = hr + ":" + min + ":" + sec;
        $timeout(tick, $scope.tickInterval); // reset the timer
    }
 	
    // Start the timer
    $timeout(tick, $scope.tickInterval);
}

In above function , we used recursion to update ti variable and afterward changed to required format .

Thanks for reading