2013-11-25 14 views
18

Mam wymaganie, w którym chcę przekonwertować milisekundy na xHours i yMins w AngularJS.AngularJS - Jak przekonwertować milisekundy na xHours i yMins

Na przykład. 3600000 powinno być wyświetlane jako 1h 0m.

Próbowałem używać date:'H:m' i date:'HH:mm' z date formats na stronie Angular's.

Ale te dają 19: 0 i 19:00 zamiast 1h 0m.

Wszelkie wskazówki dotyczące osiągnięcia tego będą pomocne.

Dzięki

+3

można napisać niestandardowy filtr. 'date' nie służy do wyświetlania przedziałów czasowych. – akonsu

Odpowiedz

10

Będziemy chcieli wykorzystać moment's obiektów trwania.

Aby zrobić to, co chcesz, spróbuj tego:

app.controller 'MainCtrl', ($scope) -> 
    $scope.name = 'World' 
    $scope.milliseconds = 3600000 
    $scope.duration = moment.duration($scope.milliseconds) 

a znaczników

<body ng-controller="MainCtrl"> 
    <p>Milliseconds: {{milliseconds}}</p> 
    <p>Duration: {{duration.hours()}}h {{duration.minutes()}}m</p> 
</body> 

plunkr: http://plnkr.co/edit/2HL75Tmr4CoAy5R9smkx

30

Niech zrobić własny filtr do tego, np:

.filter('millSecondsToTimeString', function() { 
    return function(millseconds) { 
    var oneSecond = 1000; 
    var oneMinute = oneSecond * 60; 
    var oneHour = oneMinute * 60; 
    var oneDay = oneHour * 24; 

    var seconds = Math.floor((millseconds % oneMinute)/oneSecond); 
    var minutes = Math.floor((millseconds % oneHour)/oneMinute); 
    var hours = Math.floor((millseconds % oneDay)/oneHour); 
    var days = Math.floor(millseconds/oneDay); 

    var timeString = ''; 
    if (days !== 0) { 
     timeString += (days !== 1) ? (days + ' days ') : (days + ' day '); 
    } 
    if (hours !== 0) { 
     timeString += (hours !== 1) ? (hours + ' hours ') : (hours + ' hour '); 
    } 
    if (minutes !== 0) { 
     timeString += (minutes !== 1) ? (minutes + ' minutes ') : (minutes + ' minute '); 
    } 
    if (seconds !== 0 || millseconds < 1000) { 
     timeString += (seconds !== 1) ? (seconds + ' seconds ') : (seconds + ' second '); 
    } 

    return timeString; 
}; 
}); 

Następnie użyj go:

<div>{{ millSeconds | millSecondsToTimeString }}</div> 
11

Jest data konwerter w angularjs, wystarczy ustawić odpowiedni format daty:

{{milliseconds | date:'yyyy-MM-dd HH:mm'}} 

także stworzyłem taki filtr 'timeAgo' jQuery timeago() funkcja:

.filter('timeAgo', function() { 
    return function(input) { 
     if (input == null) return ""; 
     return jQuery.timeago(input); 
    }; 
}) 

Zastosowanie:

{{milliseconds | timeAgo}} 

lub używać razem zarówno format daty szerokiej reprezentacji:

<span>{{milliseconds | timeAgo}}, {{milliseconds | date:'yyyy-MM-dd HH:mm'}}</span> 

Wynik:

12 minutes ago, 2015-03-04 11:38 
0

Dla każdego, kto chce mieć separatory przecinkami (np '21 dni, 14 godzin, 7 minut '):

'use strict'; 

angular.module('contests').filter('duration', function() { 
    return function(milliseconds) { 
     var seconds = Math.floor(milliseconds/1000); 
     var days = Math.floor(seconds/86400); 
     var hours = Math.floor((seconds % 86400)/3600); 
     var minutes = Math.floor(((seconds % 86400) % 3600)/60); 
     var dateTimeDurationString = ''; 
     if ((days > 0) && (hours === 0 && minutes === 0)) dateTimeDurationString += (days > 1) ? (days + ' days ') : (days + ' day '); 
     if ((days > 0) && (hours > 0 || minutes > 0)) dateTimeDurationString += (days > 1) ? (days + ' days, ') : (days + ' day, '); 
     if ((hours > 0) && (minutes > 0)) dateTimeDurationString += (hours > 1) ? (hours + ' hours, ') : (hours + ' hour, '); 
     if ((hours > 0) && (minutes === 0)) dateTimeDurationString += (hours > 1) ? (hours + ' hours ') : (hours + ' hour '); 
     if (minutes > 0) dateTimeDurationString += (minutes > 1) ? (minutes + ' minutes ') : (minutes + ' minute '); 
     return dateTimeDurationString; 
    }; 
}); 
4

Dzięki. Zmieniliśmy nieco filtr, by wyświetlać czas powrotu w formacie hh: mm: ss.

.filter('duration', function() { 
    //Returns duration from milliseconds in hh:mm:ss format. 
     return function(millseconds) { 
     var seconds = Math.floor(millseconds/1000); 
     var h = 3600; 
     var m = 60; 
     var hours = Math.floor(seconds/h); 
     var minutes = Math.floor((seconds % h)/m); 
     var scnds = Math.floor((seconds % m)); 
     var timeString = ''; 
     if(scnds < 10) scnds = "0"+scnds; 
     if(hours < 10) hours = "0"+hours; 
     if(minutes < 10) minutes = "0"+minutes; 
     timeString = hours +":"+ minutes +":"+scnds; 
     return timeString; 
    } 
}); 
0

Spróbuj jeden

var app = angular.module ('myApp', []) ; 
app.controller ('myController', function ($scope, $filter) { 
    $scope.date = $filter('date')(milliseconds, 'MM/dd/yyyy'); 
}); 
+0

Podczas gdy ten kod może odpowiedzieć na pytanie, podanie dodatkowego kontekstu dotyczącego * dlaczego * i/lub * w jaki sposób * ten kod odpowiada na pytanie, poprawia jego długoterminową wartość. –

0
(function() { 
    'use strict'; 

    angular 
     .module('module_name') 
     .filter('secondsToDateTime', secondsToDateTime); 

    function secondsToDateTime() { 
     return function(seconds) { 
      return new Date(1970, 0, 1).setSeconds(seconds); 
     }; 
    } 
})(); 


<span>{{seconds | secondsToDateTime | date:'HH:mm:ss'}}</span> 
0

użycia poniżej składni

$filter('date')(dateObj, format) 

np

$filter('date')(1324339200000, 'dd/MM/yyyy'); 
Powiązane problemy