wake-up-neo.com

AngularJS - Wie konvertiert man Millisekunden in xHours und yMins?

Ich habe eine Anforderung, bei der ich Millisekunden in xHours und yMins in AngularJS konvertieren möchte.

Für ex. 3600000 sollte als 1h 0m angezeigt werden.

Ich habe versucht, date:'H:m' und date:'HH:mm' aus den dateiformaten auf der Website von Angular zu verwenden.

Aber diese geben 19: 0 und 19:00 statt 1h 0m.

Alle Hinweise, um dies zu erreichen, werden hilfreich sein.

Vielen Dank

javascriptangularjsdate-formatdate-formatting
18
Pritish

Lassen Sie einen benutzerdefinierten Filter dafür erstellen, z.

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

Dann benutze es:

<div>{{ millSeconds | millSecondsToTimeString }}</div>
31
haotang

Es gibt einen Datumsumrechner in AngularJS, einfach das gewünschte Datumsformat einstellen:

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

Ich habe auch einen solchen 'timeAgo'-Filter mit der jQuery-Funktion timeago () erstellt:

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

Verwendungszweck: 

{{milliseconds | timeAgo}}

oder verwenden Sie beide Formate gemeinsam für die Darstellung von Datumsangaben:

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

Ergebnis:

12 minutes ago, 2015-03-04 11:38
11
Dmitri Algazin

Sie möchten Moment Dauerobjekte verwenden.

Versuchen Sie Folgendes, um das zu tun, was Sie möchten:

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

Und das 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

10
codevinsky

Vielen Dank. Ich habe Ihren Filter leicht geändert, um die Dauer im Format hh: mm: ss zurückzugeben.

.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;
    }
});
4
Vaughn
(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
Musleh Uddin

Verwenden Sie die folgende Syntax

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

z.B.

$filter('date')(1324339200000, 'dd/MM/yyyy');
0
Shridhar Sagari

Probier diese

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

Für alle, die Kommaseparatoren wünschen (z. B. "21 Tage, 14 Stunden, 7 Minuten"):

'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;
    };
});
0
xiaogwu