Moment JS-显示距日期的天数和小时数 [英] Moment js - displaying days and hours away from a date

问题描述

我正在一个需要对日期对象进行这种文本响应的项目​​.

I am working on a project that requires this kind of text response on a date object.

距离1天7小时" ---一定要这样-而不是"31小时外"或"1天外" -同样，我正在使用moment js-就像我在进行英语和德语之间的语言切换时一样-因此，我充分利用了moment.js语言区域设置

"1 day 7 hours away" --- it needs to be this way - not "31 hours away" or "1 day away" -- also I am using moment js - as I am doing language switching between English and German - so I've tapped into the moment.js language locale

moment.locale('de')

我正在使用moment js-当前我创建了一个假的日期对象

I am using moment js - currently I've created a fake date object

  var futureDate = new Date()
  futureDate.setDate(futureDate.getDate() + 1)// add a day
  futureDate.setHours(7)// add 7 hours

当我尝试渲染js时

moment(futureDate).endOf('day').fromNow()

它只是说一天"

我如何修改矩函数以处理1天7个小时-也许重新调整句子?

How do I modify the moment function to handle 1 day 7 hours -- and maybe re-jig the sentence?

-代码段尝试

moment.locale('de') // switch between en and de -- english and german

var futureDate = new Date()
futureDate.setDate(futureDate.getDate() + 1)// add a day
futureDate.setHours(7)// add 4 hours

// Results in hours
console.log(moment(futureDate).endOf('day').fromNow()); 

<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>

使用差异进行代码测试2

code test 2 using difference

moment.locale('de') // switch between en and de -- english and german

var a = moment();
var b = moment(a).add(31, 'hours');

// Results in days
console.log(b.diff(a, 'days'));
console.log(b.diff(a, 'days', true)); 

<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>

推荐答案

您可以使用 relativeTime ( moment.updateLocale键)以自定义力矩如何显示相对时间(例如fromNow()输出).

You can use relativeTimeThreshold and relativeTime (key of moment.updateLocale) to customize how moment shows relative time (e.g. the fromNow() output).

就您而言，您可以:

• 调整阈值以获取以秒为单位的差异(请参阅:如何使moment.js以秒为单位显示相对时间?)
• 使用 moment.duration(Number, String) 创建持续时间对象.
• 使用 moment-duration-format 插件显示持续时间值以您喜欢的格式.

• Adjust threshold to get difference in seconds (see: How to make moment.js show relative time in seconds?).
• Create a duration object using moment.duration(Number, String).
• Use moment-duration-format plug-in to show duration value in the format you prefer.

这里有一个现场样本:

var momEn = moment().add({d:1, h:7});
var momDe = moment().locale('de').add({d:1, h:7});

console.log(momEn.fromNow()); // in a day
console.log(momDe.fromNow()); // in einem Tag

// Change relativeTimeThreshold
moment.relativeTimeThreshold('s', 60*60*24*30*12);

// Update relative time
moment.updateLocale('en', {
  relativeTime : {
    s: function (number, withoutSuffix, key, isFuture){
      return moment.duration(number, 's').format('d [day] h [hour]');
    },
  }
});

moment.updateLocale('de', {
  relativeTime : {
    s: function (number, withoutSuffix, key, isFuture){
      return moment.duration(number, 's').format('d [Tag] h [Uhr]');
    },
  }
});

console.log(momEn.fromNow()); // in 1 day 7 hour
console.log(momDe.fromNow()); // in 1 Tag 7 Uhr

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment-with-locales.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-duration-format/1.3.0/moment-duration-format.min.js"></script>

不幸的是，您必须手动更新需要支持的每个区域设置.

Unfortunately you have to manually update each locale you need to support.

这篇关于Moment JS-显示距日期的天数和小时数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！