Question

我是AngularJS的新手，我想计算two datetime object with format之间的时差：

小时：分钟：秒

但我希望及时获得两位数输出：

预期输出：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>

Answer 1

您可以使用ng-repeat中的过滤器来实现它：

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>

Answer 2

您可以使用＆＃34; $ filter＆＃34;角度来格式化你的日期

一名工作人员：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>

Answer 3

以这样的角度制作一个函数。

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);




}

make parse function

 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>

如何计算AngularJS中2个日期时间对象的时差？

3 个答案: