如何計算AngularJS中的2個日期時間對象的時差？

-2

我在AngularJS非常新，我要計算時間差two datetime object with format之間：如何計算AngularJS中的2個日期時間對象的時差？

小時：分鐘：秒

但我希望得到兩位數的輸出時間：

預期輸出：00：00：04

輸入：

StartDate=2016-06-29 15:52:32.360 

EndDate=2016-06-29 15:53:36.970 

Expected output: 00 : 01 : 04

這是我的代碼：

public class User 
{ 
     public int Id { get; set; } 
     public Nullable<System.DateTime> StartDateTime { get; set; } 
     public Nullable<System.DateTime> EndDateTime { get; set; } 
} 

Json output: 

[ 
    { 
    "Id": 121, 
    "StartDateTime": "\/Date(1467195752360)\/", //2016-06-29 15:52:32.360 
    "EndDateTime": "\/Date(1467195756970)\/", //2016-06-29 15:53:36.970 
    }, 
    { 
    "Id": 122, 
    "StartDateTime": "\/Date(1467195752360)\/",// 2016-06-29 15:52:32.360 

    "EndDateTime": "\/Date(1467195758360)\/", //2016-06-29 15:53:36.970 
    } 
]

代碼：

<td ng-repeat="item in User"> 
     //How to display time difference here 
     <p> Hour : Minutes : Seconds </p 
    </td>

來源

2016-07-05 Learning-Overthinker-Confused

不關心它們。你做什麼來嘗試這個？ – AlainIb

你會如何比較JavaScript中的日期？ –

這是你的日期時間是從引導日期時間或從JavaScript返回的日期字符串日期 –

可以在NG-重複使用過濾器實現它：

var app = angular.module('app', []); 
 

 
app.controller('mainCtrl', function ($scope) { 
 
    $scope.timeSlots = [ 
 
    { 
 
     "startDate":1467195752360, 
 
     "endDate":1467195756970 
 
    }, 
 
    { 
 
     "startDate":1467195752360, 
 
     "endDate":1467195758360 
 
    } 
 
    ]; 
 
}); 
 

 
app.filter("getDiff", function() { 
 
    return function(time) { 
 
    var startDate = new Date(time.startDate); 
 
    var endDate = new Date(time.endDate); 
 
    var milisecondsDiff = endDate - startDate; 
 
    
 
     return Math.floor(milisecondsDiff/(1000*60*60)).toLocaleString(undefined, {minimumIntegerDigits: 2}) + ":" + (Math.floor(milisecondsDiff/(1000*60))%60).toLocaleString(undefined, {minimumIntegerDigits: 2}) + ":" + (Math.floor(milisecondsDiff/1000)%60).toLocaleString(undefined, {minimumIntegerDigits: 2}) ; 
 
    
 
    } 
 
});

<!DOCTYPE html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script> 
 
</head> 
 

 
<body ng-controller="mainCtrl"> 
 
    <p ng-repeat = "time in timeSlots" ng-bind="time | getDiff"> 
 
</body> 
 
</html>

來源

2016-07-05 14:44:09 Deep

當我使用ng重複時，我如何爲每個記錄執行此操作 –

@JonK感謝您指出，我已更新答案。 – Deep

在你的plunker輸出中獲得NAN –

可以使用的角度對「$過濾器」的日期格式，以您的

工作plunker：http://plnkr.co/edit/4QzT8688iQkIxoqnJVy0?p=preview

JS：

 // Declare the main module 
var myApp = angular.module('myApp', []); 

angular.module('myApp').controller('Ctrl1', ['$scope','$filter', function($scope,$filter) { 


    $scope.dates = [ 
    { 
     "Id": 121, 
     "StartDateTime": 1467195752360, //2016-06-29 15:52:32.360 
     "EndDateTime": 1467195756970, //2016-06-29 15:53:36.970 
    }, 
    { 
     "Id": 122, 
     "StartDateTime": 1467195752360, // 2016-06-29 15:52:32.360 
     "EndDateTime": 1467195758360, //2016-06-29 15:53:36.970 
    } 
    ]; 

    var compute = function(dates) { 
    for (var i in dates){ 
     dates[i].hours = $filter('date')(dates[i]["EndDateTime"]-dates[i]["StartDateTime"], 'hh') ; 
     dates[i].minutes = $filter('date')(dates[i]["EndDateTime"]-dates[i]["StartDateTime"], 'mm') ; 
     dates[i].secondes = $filter('date')(dates[i]["EndDateTime"]-dates[i]["StartDateTime"], 'ss') ; 
    } 

    } 

    compute($scope.dates); 


}]);

HTML：

<div ng-controller="Ctrl1"> 
     <div ng-repeat="date in dates"> 
    {{ date.hours }} :{{ date.minutes }} : {{date.secondes }} 
    </div> 

</div>

來源

2016-07-05 14:45:03 AlainIb

你能證明我該如何使用ng-repeat，因爲這將會重複 –

對不起，我不記得你想要什麼。你想使用ng-repeat並在視圖中進行計算？ – AlainIb

我在說我得到的記錄列表，我想計算每個記錄的2日期時間對象的差異。你已經做過單記錄。考慮你有超過1條記錄，你想計算每個記錄的時間差這記錄你如何做到這一點？ –

像這樣在角度上做一個函數。

var timediff=function(){ 
var startdate=StartDate;//yr json date. 
var enddate=EndDate; 

// here we will split date time string to get date hour min sec invidually. 
var arr=[]; 
arr=startdate.split(' ');//split date and time 
date=arr[0]; 
var arr0=[]; 
arr0=date.split('-');//split date into yr,date, month 

time=arr[1]; 
var arr1=[]; 
arr1=time.split(':');//split time into min , hour, sec 

var datebegin = new Date(arr0[0], arr0[1]-1, arr0[2], arr1[0], arr1[1],arr1[2]) 

var arr=[]; 
arr=enddate.split(' '); 
date=arr[0]; 
var arr0=[]; 
arr0=date.split('-'); 

time=arr[1]; 
var arr1=[]; 
arr1=time.split(':'); 

var dateend = new Date(arr0[0], arr0[1]-1, arr0[2], arr1[0], arr1[1],arr1[2]) 

var timeLeft = dateend-datestart ; 
parseTime(timeLeft); 




}

化妝解析功能

var parseTime=function(diff){ 

var msec = diff; 
var hh = Math.floor(msec/1000/60/60); 
msec -= hh * 1000 * 60 * 60; 
var mm = Math.floor(msec/1000/60); 
msec -= mm * 1000 * 60; 
var ss = Math.floor(msec/1000); 
msec -= ss * 1000; 

$scope.hh=hh; 
    $scope.mm=mm; 
$scope.ss=ss; 
}

在代碼中使用這樣的這些範圍變量。

<p> {{hh}} : {{mm}} : {{ss}}</p>

來源

2016-07-05 14:51:53

你能告訴我如何在每個記錄的p標記內的html視圖中使用它嗎？ –

我正在編輯我的答案，向您解釋更多。 –

所以當我得到我的記錄在Ajax成功函數我循環到該記錄和每個記錄調用你的函數timediff和在這個函數中，我通過我的startdate和enddate？ –

如何計算AngularJS中的2個日期時間對象的時差？

回答

相關問題