2013-11-25 11 views
18

Ho un requisito in cui voglio convertire millisecondi in xHours e yMins in AngularJS.AngularJS - Come convertire i millisecondi in xHours e yMins

Per es. 3600000 dovrebbe essere visualizzato come 1h 0m.

Ho provato a utilizzare date:'H:m' e date:'HH:mm' dal numero date formats sul sito Web di Angular.

Ma quelli danno 19: 0 e 19:00 invece di 1h 0m.

Qualsiasi suggerimento per raggiungere questo risultato sarà utile.

Grazie

+3

è possibile scrivere un filtro personalizzato. 'date' non è per visualizzare gli intervalli di tempo. – akonsu

risposta

10

Ti consigliamo di utilizzare moment's oggetti durata.

di fare ciò che si vuole, provare questo:

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

E il markup

<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

Facciamo fare un filtro personalizzato per questo, ad esempio:

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

Poi usarlo:

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

C'è convertitore data AngularJS, basta impostare richieste formato della data:

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

Inoltre ho creato tale filtro 'timeAgo' utilizzando jQuery timeago) Funzione (:

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

Usage:

{{milliseconds | timeAgo}} 

o utilizzare insieme sia formato per un'ampia rappresentanza Data:

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

Risultato:

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

Per chi vuole avere separatori virgola (ad esempio "21 giorni, 14 ore, 7 minuti"):

'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

Grazie. Ho modificato leggermente il filtro per restituire la durata nel formato 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

Provate questo

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

Sebbene questo codice possa rispondere alla domanda, fornendo un contesto aggiuntivo riguardante * perché * e/o * come * questo codice risponde alla domanda, migliora il suo valore a lungo termine. –

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

Usa sotto sintassi

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

esempio

$filter('date')(1324339200000, 'dd/MM/yyyy'); 
Problemi correlati