how do i get the time difference in angular js?

Question

I want to calculate the ot hours from difference of the out time and in time.i would like to know the possible way to achieve it using angular js.importanly i need it in hour:minutes:seconds format.following is sample of my code.

my view

<table class="row-border hover table table-bordered cb-data-table">
    <tr>
        <th>In Time</th>
        <th>Out Time</th>
        <th>OT Hours</th>
    </tr>

    <tr ng-show="!dailyAttendances.length">
        <td colspan="3" style="text-align: center">~ No Any Records ~</td>
    </tr>

    <tr  ng-repeat="dailyAttendance in dailyAttendances" >
          <td>@{{ dailyAttendance.in_time}}</td>
          <td>@{{ dailyAttendance.out_time}}</td>
          <td></td>                           
    </tr>
</table>

My javascript file

$scope.loadAllDailyAttendance = function () {

        $scope.dailyAttendances = {};


        $http({
            method: "GET",
            url: "/attendance/loadAllDailyAttendance",
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },

        }).then(function successCallback(response) {
            $scope.dailyAttendances = response.data;
            console.log(response.data);
            }, function errorCallback(response) {
        });
    };

Answer 1

In Component:

timeDuration(endTime: string, startTime: string): string {
    const endDate = new Date(endTime).getTime();
    const startDate = new Date(startTime).getTime();
    const time = endDate - startDate;
    return this.mlsecondsToTime(time);
}

private mlsecondsToTime(milliSec: number): string {
    function pad(n: number): string {
        const z = 2;
        return ('00' + n).slice(-z);
    }

    let x = milliSec / 1000;
    const seconds = x % 60;
    x /= 60;
    const minutes = Math.floor(x % 60);
    x /= 60;
    const hours = Math.floor(x % 24);
    return pad(hours) + ':' + pad(minutes) + ':' + pad(seconds);
}

In Markup:

  <td> {{timeDuration(dailyAttendance.in_time, dailyAttendance.in_time)}} </td>