source

Angular.js: HH:mm:ss 필터까지의 초수

ittop 2023. 3. 8. 21:46
반응형

Angular.js: HH:mm:ss 필터까지의 초수

카운트 초수는 713초 등입니다.이 713초를 HH:mm:ss 형식으로 변환하는 Angular.js 필터를 구현하려면 어떻게 해야 합니까?이 경우 00:11:53 이 됩니다.

<div>
  {{ 713 | secondsToHHMMSS }} <!-- Should output 00:11:53 -->
</div>

다음과 같은 방법을 사용해 보십시오.

app.filter('secondsToDateTime', [function() {
    return function(seconds) {
        return new Date(1970, 0, 1).setSeconds(seconds);
    };
}])

html:

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

데모

manzapanza의 답변은 초수가 86400(1일) 미만일 경우에만 유효합니다.날짜 개체는 완전히 0이어야 합니다.또한 angularjs가 다시 만들지 않도록 실제 날짜 객체를 반환하는 것이 좋습니다.

app.filter('secondsToDateTime', function() {
    return function(seconds) {
        var d = new Date(0,0,0,0,0,0,0);
        d.setSeconds(seconds);
        return d;
    };
});

그리고.

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

편집: 일 단위로 줄이지 않고 24시간 이상 경과하려면 날짜를 사용하지 않는 것이 좋습니다.

app.filter('secondsToTime', function() {

    function padTime(t) {
        return t < 10 ? "0"+t : t;
    }

    return function(_seconds) {
        if (typeof _seconds !== "number" || _seconds < 0)
            return "00:00:00";

        var hours = Math.floor(_seconds / 3600),
            minutes = Math.floor((_seconds % 3600) / 60),
            seconds = Math.floor(_seconds % 60);

        return padTime(hours) + ":" + padTime(minutes) + ":" + padTime(seconds);
    };
});

그리고.

<b>{{seconds | secondsToTime}}</b>

이것을 시험해 보세요.

app.filter('secondsToHHmmss', function($filter) {
    return function(seconds) {
        return $filter('date')(new Date(0, 0, 0).setSeconds(seconds), 'HH:mm:ss');
    };
})

html:

<b>{{seconds | secondsToHHmmss}}</b>
app.filter('formatTimer', function () {
return function (input) {
    function z(n) { return (n < 10 ? '0' : '') + n; }
    var seconds = input % 60;
    var minutes = Math.floor(input % 3600 / 60);
    var hours = Math.floor(input / 3600);
    return (z(hours) + ':' + z(minutes) + ':' + z(seconds));
};

will 출력: 02:04:14

커스텀 필터는 필요 없다고 생각합니다.

<b>{{hours}}{{seconds | date:':mm:ss'}}</b>

function Scoper($scope) {
    $scope.seconds = '79000';
    $scope.hours = parseInt($scope.seconds / 3600);
}

@manzapanza 솔루션에 의한 일수:

  $scope.duration_for = function(seconds){
    if(!seconds) return
    var duration = new Date(1970, 0, 1).setSeconds(seconds)

    var mask = 'HH:mm'
    if(seconds >= 86400){
      mask = 'd days,' + mask
    }

    return $filter('date')(duration, mask);
  }

표시:

{{duration_for(100500)}}

언급URL : https://stackoverflow.com/questions/28394572/angular-js-seconds-to-hhmmss-filter

반응형