Làm cách nào để sử dụng định dạng () trong khoảng thời gian?


211

Có cách nào tôi có thể sử dụng phương thức Moment.js format trên các đối tượng thời lượng không? Tôi không thể tìm thấy nó ở bất cứ đâu trong các tài liệu và nó không được coi là một thuộc tính trên các đối tượng thời lượng.

Tôi muốn có thể làm một cái gì đó như:

var diff = moment(end).unix() - moment(start).unix();
moment.duration(diff).format('hh:mm:ss')

Ngoài ra, nếu có bất kỳ thư viện nào khác có thể dễ dàng chứa loại chức năng này, tôi sẽ quan tâm đến các đề xuất.

Cảm ơn!


5
khoảnh khắc.utc (thời gian.asMilliseconds ()). định dạng ('hh: mm: ss'); - Một thời lượng là một vectơ. Bằng cách đặt đuôi của nó vào gốc, bạn có thể sử dụng định dạng ngày để lấy hh: mm: ss.
Paul Williams

moment.utc (moment.duration (23 'giây') asMilliseconds ().) định dạng ( 'hh: mm: ss') => "00:00:23" không hoạt động rất tốt.
tỷ lệ vàng

Ah, tôi tìm thấy vấn đề, HH:mm:sssẽ đưa ra 00:00:23trong ví dụ trước của tôi. vì vậy chỉ là vỏ sai trong phần Giờ
Goldenratio

Câu trả lời:


55

Chúng tôi đang xem xét thêm một số loại định dạng vào thời lượng trong khoảnh khắc.js. Xem https://github.com/timrwood/moment/issues/463

Một vài thư viện khác có thể giúp đỡ là http://countdownjs.org/https://github.com/icambron/twix.js


4
Tôi cũng mong được định dạng thời lượng. Nhìn vào đếm ngược bây giờ, nhưng twix dường như chỉ thực hiện định dạng "thông minh", không có nhiều tùy chỉnh.
mở

2
Mặc dù twix hoạt động chăm chỉ để thực hiện định dạng thông minh, nhưng nó có rất nhiều tùy chọn định dạng, ngay đến các mã thông báo có liên quan: github.com/icambron/twix.js/wiki/Formatted . Disclaimer: Tôi là tác giả của twix.

3
Countdown.js là tuyệt vời và tác giả là siêu hữu ích (anh ta chỉ phát hành 2 phiên bản trong cùng một ngày do một số đề xuất tôi đã thực hiện)!
Ohad Schneider

5
Tôi bỏ phiếu vì vấn đề github được liên kết trong câu trả lời này chỉ là một ý kiến, mong muốn và những lời tán dương không bao giờ kết thúc, vấn đề vẫn còn mở sau 4 năm, không có gì hữu ích
bmaggi

29
Tại sao nó không thể giống hệt với .format khác được sử dụng ở nơi khác trong thư viện? Đây là sự điên rồ. 5 năm rồi mà vẫn chưa xong? có thật không?!
kristopolous

164
// set up
let start = moment("2018-05-16 12:00:00"); // some random moment in time (in ms)
let end = moment("2018-05-16 12:22:00"); // some random moment after start (in ms)
let diff = end.diff(start);

// execution
let f = moment.utc(diff).format("HH:mm:ss.SSS");
alert(f);

Hãy nhìn vào JSFiddle


3
Cách tiếp cận tốt. Mặc dù nó không hoạt động nếu tôi cũng muốn hiển thị ngày: DDD HH:mm:ss.SSS(nơi DDDlà ngày trong năm) hiển thị 1khi tôi muốn 0. Bất kỳ sửa chữa nhanh chóng cho điều đó?
Andrew Mao

1
Không có cách nào dễ dàng. Tôi đã làm điều này jsfiddle.net/fhdd8/14 , đó có thể là những gì bạn đã làm, nhưng tôi không nghĩ rằng khoảnh khắc có bất cứ điều gì làm điều đó ra khỏi hộp
David Glass

49
Sẽ không có ý nghĩa gì khi hiển thị 10 triệu triệu mili giây như mm: ss
Cầu tàu-Luc Gendreau

28
việc này không hoạt động trong 24 giờ (tức là nếu tôi muốn hiển thị 117 giờ). Nếu không thì giải pháp tuyệt vời!
Phil

1
@Phil bạn có thể sử dụng "D" hoặc "DD" nếu bạn muốn hiển thị ngày.
Vinay

71

chuyển đổi thời lượng thành ms và sau đó thành khoảnh khắc:

moment.utc(duration.as('milliseconds')).format('HH:mm:ss')

14
Vì vậy, điều này không hoạt động nếu thời lượng của bạn dài hơn 24h .. 24h được đặt lại thành 0h
S. Robijns

4
@ S.Robijns một quan sát hữu ích nhưng chỉ để nhấn mạnh cho người khác - đây hành vi dự kiến ​​của .format('HH:mm:ss'). Xem tài liệu
davnicwil

1
đây là câu trả lời tốt nhất
Magico

44

Sử dụng plugin này Format Moment Thời gian .

Thí dụ:

moment.duration(123, "minutes").format("h:mm");

1
Định dạng đó không hoạt động chính xác, phía thời lượng là tốt nhưng nếu tôi chỉ định hh:mm:mmvà chỉ có 10 giây thì nó hiển thị 10thay vì 00:00:10(ngay cả khi bật đèn nền) Nếu không định dạng ... thì nên gọi là định dạng khác, định dạng nên được gọi là chuẩn hóa.
Piotr Kula

9
@ppumkin tôi biết cái này đã cũ nhưng nếu bạn chỉ định { trim: false }thì nó sẽ dừng hành vi đó.
Carlos Martinez

3
Đây là những gì tôi thích sử dụng: Giả sử bạn có thời lượng, giống như const duration = moment.duration(value, 'seconds');tôi có thể được định dạng bằng cách sử dụng: moment.utc(duration.as('milliseconds')).format('HH:mm:ss').toString();
Evgeny Bobkin

1
@EvgenyBobkin sẽ không hoạt động nếu thời lượng của bạn dài hơn một ngày, thư viện sẽ xử lý mặc dù
reggaeg Ức

16

Sử dụng dòng mã này:

moment.utc(moment.duration(4500, "seconds").asMilliseconds()).format("HH:mm:ss")

8
Nếu thời lượng là> 86400 '' (tức là 24h), điều này sẽ không hoạt động.
Lorenzo Tassone

Nó giống nhau trong excel, nó sẽ xuất hiện sau 24 giờ. Đây là một cách giải quyết tuyệt vời nếu bạn biết về giới hạn 24 giờ.
Eman4real

15
var diff = moment(end).unix() - moment(start).unix();
moment.utc(moment.duration(diff).asMilliseconds()).format("HH:mm:ss.SSS");

1
Nói chung, câu trả lời sẽ hữu ích hơn nhiều nếu chúng bao gồm một lời giải thích về những gì mã được dự định làm và tại sao điều đó giải quyết vấn đề mà không giới thiệu người khác. (Bài đăng này đã được ít nhất một người dùng gắn cờ, có lẽ vì họ nghĩ rằng một câu trả lời mà không cần giải thích nên bị xóa.)
Nathan Tuggy

1
Giải thích hay không, đây là những gì đã làm cho tôi. Cảm ơn :)
dmmd

Giải thích là không cần thiết. Tài liệu Moment.js có thể chỉ ra cách giải pháp này đã đạt được.
coffekid

2
Vô ích. Giống như hầu hết các câu trả lời khác cho câu hỏi này trả về một phần giờ trong thời lượng không phải tổng số giờ. Ví dụ: trả về 12:00 trong khoảng thời gian.duration ({ngày: 2, giờ: 12})
Neutrino

1
khoảnh khắc.duration (diff) .asMilliseconds () là quá mức. Bạn chỉ có thể sử dụng diff, nó đã tính bằng mili giây.
kristopolous

12

Kịch bản tốt nhất cho trường hợp sử dụng cụ thể của tôi là:

var duration = moment.duration("09:30"),
    formatted = moment.utc(duration.asMilliseconds()).format("HH:mm");

Điều này cải thiện câu trả lời của @ Wilson vì nó không truy cập tài sản nội bộ tư nhân _data.


Cảm ơn bạn @TaeKwonJoe
Kamlesh

11

Bạn không cần .format. Sử dụng thời lượng như thế này:

const duration = moment.duration(83, 'seconds');
console.log(duration.minutes() + ':' +duration.seconds());
// output: 1:23

Tôi tìm thấy giải pháp này tại đây: https://github.com/moment/moment/issues/463

BIÊN TẬP:

Và với phần đệm trong vài giây, phút và giờ:

const withPadding = (duration) => {
    if (duration.asDays() > 0) {
        return 'at least one day';
    } else {
        return [
            ('0' + duration.hours()).slice(-2),
            ('0' + duration.minutes()).slice(-2),
            ('0' + duration.seconds()).slice(-2),
        ].join(':')
    }
}

withPadding(moment.duration(83, 'seconds'))
// 00:01:23

withPadding(moment.duration(6048000, 'seconds'))
// at least one day

2
Điều này sẽ không bao gồm các số 0 đứng đầu nếu thời
gian.seconds

Điều gì sẽ xảy ra nếu bạn có nhiều giây hơn một giờ? Có ổn không, khi đó bạn có hơn 60 giây?
shaedrich

Các số 0 đứng đầu hoạt động, nhưng duration = moment.duration(7200, 'seconds'); withPadding(duration);sẽ nói "00:00".
shaedrich

@shaedrich Tôi cập nhật lại câu trả lời của mình để bao gồm cả giờ; nếu bạn cần ngày, tuần, cũng như bạn có thể thêm chúng vào mảng
ni-ko-o-kin

1
if (duration.asDays() > 0) { return 'at least one day';- tôi đang đọc đúng không?
Stephen Paul

8

Tôi sử dụng:

var duration = moment.duration("09:30");
var str = moment(duration._data).format("HH:mm");

Và tôi nhận được "09:30" trong var str.


Tuyệt quá! Điều này chỉ hoạt động ... làm thế nào trên trái đất bạn đã đưa ra điều này :)
vanthome

4
Tránh giải pháp này, _datalà một tài sản nội bộ và có thể thay đổi mà không cần cảnh báo.
Druska

1
Thật không may, nó sẽ không hoạt động như mong đợi: moment(moment.duration(1200000)._data).format('hh:mm:ss')sẽ trở lại 12:20 thay vì 00:20
Anna R

2
@AnnaR hnằm trong phạm vi 1-12, vì vậy điều đó khá đáng mong đợi. Sử dụng Hthay thế tài liệu - mã thông báo giờ
barbsan

Điều này là sai, không chỉ bạn bỏ qua NGÀY, vì vậy 1 ngày và 1 giờ sẽ được hiển thị là 01:00. Ngoài ra, bạn hoàn toàn bỏ qua các moment.utc(...).format("HH:mm");
múi

5

nếu khác biệt là một khoảnh khắc

var diff = moment(20111031) - moment(20111010);
var formated1 = moment(diff).format("hh:mm:ss");
console.log("format 1: "+formated1);

Điều này dường như không đáng tin cậy khi đối mặt với múi giờ và như vậy. Bạn có sử dụng điều này trong sản xuất?
Keith

câu hỏi không đề cập đến múi giờ.
Kieran

3
Mọi người sống trong một múi giờ. Có phải khoảnh khắc (0) luôn đăng ký là 12:00 AM trong mọi múi giờ không?
Keith

Tôi chỉ đơn giản là hỏi liệu mã trong câu trả lời của bạn có hoạt động hay không bởi vì tôi nghi ngờ. Tôi đã viết rất nhiều mã hoạt động với ngày tháng, bằng nhiều ngôn ngữ lập trình. Dựa trên kinh nghiệm của tôi, có vẻ như mã của bạn sẽ chỉ hoạt động trong các múi giờ nhất định - nhưng tôi đang hỏi bởi vì có lẽ có điều gì đó tôi không biết về cách Javascript biểu thị ngày gần thời đại Unix.
Keith

1
dòng thứ hai sẽ tạo ra một khoảnh khắc từ đầu thời gian (1970). Điều này sẽ không làm.
kumarharsh

5

Nếu bạn sẵn sàng sử dụng một thư viện javascript khác, numeral.js có thể định dạng giây như sau (ví dụ là trong 1000 giây):

var string = numeral(1000).format('00:00');
// '00:16:40'

chắc chắn là con đường để đi như mong đợi.
Piotr Kula

4

Tôi sử dụng chức năng định dạng cổ điển trong những trường hợp sau:

var diff = moment(end).unix() - moment(start).unix();

//use unix function instead of difference
moment.unix(diff).format('hh:mm:ss')

Đây là một hack vì thời gian khác biệt được coi là ngày thời điểm tiêu chuẩn, thời gian ngày kỷ nguyên sớm, nhưng nó không quan trọng đối với mục tiêu của chúng tôi và bạn không cần bất kỳ plugin nào


4

Nếu tất cả các giờ phải được hiển thị (hơn 24) và nếu '0' trước giờ là không cần thiết, thì việc định dạng có thể được thực hiện với một dòng mã ngắn:

Math.floor(duration.as('h')) + moment.utc(duration.as('ms')).format(':mm:ss')

4

Dựa trên câu trả lời của ni-ko-o-kin :

meassurements = ["years", "months", "weeks", "days", "hours", "minutes", "seconds"];
withPadding = (duration) => {
    var step = null;
    return meassurements.map((m) => duration[m]()).filter((n,i,a) => {
        var nonEmpty = Boolean(n);
        if (nonEmpty || step || i >= a.length - 2) {
            step = true;
        }
        return step;
    }).map((n) => ('0' + n).slice(-2)).join(':')
}

duration1 = moment.duration(1, 'seconds');
duration2 = moment.duration(7200, 'seconds');
duration3 = moment.duration(604800, 'seconds');

withPadding(duration1); // 00:01
withPadding(duration2); // 02:00:00
withPadding(duration3); // 01:07:00:00:00

Tôi không nghĩ nó rất dễ đọc. Vấn đề nào bạn muốn giải quyết ở đây? Usecase của bạn là gì?
ni-ko-o-kin

Tôi cập nhật câu trả lời của tôi một lần nữa để đối phó với hơn một ngày. Nó hoạt động tốt cho trường hợp sử dụng của tôi.
ni-ko-o-kin

2
Vấn đề là trong hầu hết các trường hợp, giải pháp của bạn không lý tưởng vì nó chứa quá nhiều số 0 đứng đầu. Ai muốn trả lại "00: 00: 00: 00"? Giải pháp của tôi là "có thể mở rộng" và thêm các số 0 hàng đầu khi cần.
shaedrich

Hoạt động hoàn hảo. Đầu ra rất đơn giản. Nếu không có ngày, sẽ không có số không cho ngày được hiển thị, v.v.
Hasan Sefa Ozalp

3

Để định dạng thời lượng khoảnh khắc thành chuỗi

var duration = moment.duration(86400000); //value in milliseconds
var hours = duration.hours();
var minutes = duration.minutes();
var seconds = duration.seconds();
var milliseconds = duration.milliseconds();

var date = moment().hours(hours).minutes(minutes).seconds(seconds).millisecond(milliseconds);
if (is12hr){
    return date.format("hh:mm:ss a");
}else{
    return date.format("HH:mm:ss");
}

3

nếu bạn sử dụng góc, hãy thêm phần này vào bộ lọc của bạn:

.filter('durationFormat', function () {
    return function (value) {
        var days = Math.floor(value/86400000);
        value = value%86400000;
        var hours = Math.floor(value/3600000);
        value = value%3600000;
        var minutes = Math.floor(value/60000);
        value = value%60000;
        var seconds = Math.floor(value/1000);
        return (days? days + ' days ': '') + (hours? hours + ' hours ': '') + (minutes? minutes + ' minutes ': '') + (seconds? seconds + ' seconds ': '')
    }
})

ví dụ sử dụng

<div> {{diff | durationFormat}} </div>

Thực sự rất tốt đẹp. Tôi đang tìm kiếm một "định dạng đẹp" như thế này. Cảm ơn!
riketscience

3

Giải pháp của tôi không liên quan đến bất kỳ thư viện nào khác và nó hoạt động với diff> 24h

var momentInSeconds = moment.duration(n,'seconds')
console.log(("0" + Math.floor(momentInSeconds.asHours())).slice(-2) + ':' + ("0" + momentInSeconds.minutes()).slice(-2) + ':' + ("0" + momentInSeconds.seconds()).slice(-2))

1

Làm thế nào về javascript bản địa?

var formatTime = function(integer) {
    if(integer < 10) {
        return "0" + integer; 
    } else {
        return integer;
    }
}

function getDuration(ms) {
    var s1 = Math.floor(ms/1000);
    var s2 = s1%60;
    var m1 = Math.floor(s1/60);
    var m2 = m1%60;
    var h1 = Math.floor(m1/60);
    var string = formatTime(h1) +":" + formatTime(m2) + ":" + formatTime(s2);
    return string;
}

1

Sử dụng định dạng thời lượng-thời gian .

Khung khách hàng (ví dụ: Phản ứng)

import moment from 'moment';
import momentDurationFormatSetup from 'moment-duration-format';
momentDurationFormatSetup(moment);

const breakLengthInMinutes = moment.duration(breakLengthInSeconds, 's').format('m');

Máy chủ (node.js)

const moment = require("moment-timezone");
const momentDurationFormatSetup = require("moment-duration-format");

momentDurationFormatSetup(moment);

const breakLengthInMinutes = moment.duration(breakLengthInSeconds, 's').format('m');

0
const duration = moment.duration(62, 'hours');
const n = 24 * 60 * 60 * 1000;
const days = Math.floor(duration / n);
const str = moment.utc(duration % n).format('H [h] mm [min] ss [s]');
console.log(`${days > 0 ? `${days} ${days == 1 ? 'day' : 'days'} ` : ''}${str}`);

Bản in:

2 ngày 14 giờ 00 phút 00 giây


0
import * as moment from 'moment'
var sleep = require('sleep-promise');

(async function () {
    var t1 = new Date().getTime();
    await sleep(1000); 
    var t2 = new Date().getTime();
    var dur = moment.duration(t2-t1); 
    console.log(`${dur.hours()}h:${dur.minutes()}m:${dur.seconds()}s`);
})();
0h:0m:1s

0

Bạn có thể sử dụng numeral.js để định dạng thời lượng của mình:

numeral(your_duration.asSeconds()).format('00:00:00') // result: hh:mm:ss

0

Điều này có thể được sử dụng để có được hai ký tự đầu tiên là giờ và hai lần cuối là phút. Logic tương tự có thể được áp dụng cho giây.

/**
     * PT1H30M -> 0130
     * @param {ISO String} isoString
     * @return {string} absolute 4 digit number HH:mm
     */

    const parseIsoToAbsolute = (isoString) => {
    
      const durations = moment.duration(isoString).as('seconds');
      const momentInSeconds = moment.duration(durations, 'seconds');
    
      let hours = momentInSeconds.asHours().toString().length < 2
        ? momentInSeconds.asHours().toString().padStart(2, '0') : momentInSeconds.asHours().toString();
        
      if (!Number.isInteger(Number(hours))) hours = '0'+ Math.floor(hours);
    
      const minutes = momentInSeconds.minutes().toString().length < 2
        ? momentInSeconds.minutes().toString().padEnd(2, '0') : momentInSeconds.minutes().toString();
    
      const absolute = hours + minutes;
      return absolute;
    };
    
    console.log(parseIsoToAbsolute('PT1H30M'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment-with-locales.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>


Nếu bạn chèn mã dưới dạng đoạn mã, bạn sẽ có thể kiểm tra phương thức và hiển thị một số đầu ra cho bảng điều khiển.
DJDaveMark

Chắc chắn rồi! Chỉ cần cập nhật với đoạn trích để kiểm tra nhanh.
Jose Luis Raffalli

0

moment.duration(x).format()đã bị phản đối Bạn có thể sử dụng moment.utc(4366589).format("HH:mm:ss")để có được phản hồi mong muốn.

console.log(moment.utc(4366589).format("HH:mm:ss"))
<script src="https://momentjs.com/downloads/moment.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


0

Làm cách nào để sử dụng chính xác thời lượng Moment.js? | Sử dụng khoảnh khắc.duration () trong mã

Đầu tiên bạn cần nhập momentmoment-duration-format.

import moment from 'moment';
import 'moment-duration-format';

Sau đó, sử dụng chức năng thời lượng. Hãy để chúng tôi áp dụng ví dụ trên: 28800 = 8 giờ sáng.

moment.duration(28800, "seconds").format("h:mm a");

EllVâng, bạn không có lỗi loại trên. Bạn có nhận được giá trị đúng 8:00 sáng không? Không có, giá trị bạn nhận được là 8:00 a. Định dạng Moment.js không hoạt động như mong muốn.

Solution Giải pháp là biến đổi giây thành mili giây và sử dụng thời gian UTC.

moment.utc(moment.duration(value, 'seconds').asMilliseconds()).format('h:mm a')

Được rồi, chúng tôi nhận được 8:00 sáng. Nếu bạn muốn 8 giờ sáng thay vì 8:00 sáng cho thời gian không thể thiếu, chúng tôi cần thực hiện RegExp

const time = moment.utc(moment.duration(value, 'seconds').asMilliseconds()).format('h:mm a');
time.replace(/:00/g, '')

0

Tôi cần phải làm điều này cho công việc như một yêu cầu để hiển thị giờ trong định dạng này. Lúc đầu tôi đã thử điều này.

moment.utc(totalMilliseconds).format("HH:mm:ss")

Tuy nhiên, mọi thứ trong vòng 24 giờ và giờ được đặt lại về 0. Nhưng phút và giây là chính xác. Vì vậy, tôi chỉ sử dụng phần đó trong vài phút và giây.

var minutesSeconds = moment.utc(totalMilliseconds).format("mm:ss")

Bây giờ tất cả những gì tôi cần là tổng số giờ.

var hours = moment.duration(totalMilliseconds).asHours().toFixed()

Và để có được định dạng đó mà tất cả chúng ta muốn chúng ta chỉ cần dán nó lại với nhau.

var formatted = hours + ":" + minutesSeconds

nếu totalMilliseconds894600000này sẽ trở lại 249:30:00.

Hy vọng rằng đã giúp. Để lại bất kỳ câu hỏi trong các ý kiến. ;)


-1

Nếu bạn sử dụng Angular> 2, tôi đã tạo một ống lấy cảm hứng từ câu trả lời @ hai-alaluf.

import {Pipe, PipeTransform} from "@angular/core";

@Pipe({
  name: "duration",
})

export class DurationPipe implements PipeTransform {

  public transform(value: any, args?: any): any {

    // secs to ms
    value = value * 1000;
    const days = Math.floor(value / 86400000);
    value = value % 86400000;
    const hours = Math.floor(value / 3600000);
    value = value % 3600000;
    const minutes = Math.floor(value / 60000);
    value = value % 60000;
    const seconds = Math.floor(value / 1000);
    return (days ? days + " days " : "") +
      (hours ? hours + " hours " : "") +
      (minutes ? minutes + " minutes " : "") +
      (seconds ? seconds + " seconds " : "") +
      (!days && !hours && !minutes && !seconds ? 0 : "");
  }
}

-3

Điều này làm việc cho tôi:

moment({minutes: 150}).format('HH:mm') // 01:30

Trả lại "Ngày không hợp lệ"
themadmax

3
150 phút không phải là 1 giờ 30 phút.
Mark Brown
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.