Question

我正在尝试使用 MomentJS 自定义时间戳的输出。使用相对时间我可以获得... mins ago，... hour ago等。使用日历我会Today at ...或HH:MM等。

但我想要的是某个时间戳的以下内容：
Just a second ago，
1 min ago，
2 min ago，
3 min ago，
...，
10 min ago，
HH:MM，
YESTERDAY，
DD/MM/YYYY。

我无法理解是否甚至可以使用此库。

我尝试了以下内容：

  var time1 = moment.unix(1509711336).fromNow();
  var time2 = moment.unix(1509711336).calendar();
  var time3 = moment.unix(1509711336).format('HH:MM');

DEMO： here

更新：假设我发布了一篇文章，那么时间应该是Just a second ago，然后是最多10分钟，或者它应该是{{1} }，1 min ago，2 min ago等等。之后，它应显示为3 min ago。然后当我们搬到第二天时，它应该只提供HH:MM，然后在那天之后它应该打印YESTERDAY。

Answer 1

像这样在矩形库中定义你自己的方法。

moment.fn.fromNowOrNow = function (a) {
    t = Math.abs(moment().diff(this) / 1000) 
    if (t < 60) { 
        return 'just now';
    }else if(t> 60 && t<36000){
      return this.fromNow(a);  
    }else if(t> 36000 && t<86400){
      return this.format("hh:mm")
    }
    this.fromNow(a);  

}

现在您可以像

一样调用此方法

moment().fromNoworNow()

注意::您可以添加更多条件，例如上面的

Answer 2

$(document).ready(function() {
  var customFn = {
    sameDay: function(now) {
      if (Math.abs(this.diff(now)/1000)<60) {
      console.log()
        return '['+this.fromNow()+']';
      } else {
        return 'HH:MM';
      }
    },
    lastDay: '[Yesterday]',
    lastWeek: '[Last] dddd',
    sameElse: 'DD/MM/YYYY'
  }
  var time1 = new moment().calendar(null, customFn);
  var time2 = moment.unix(1509711336).calendar(null, customFn);
  var time3 = moment.unix(1509580800).calendar(null, customFn);
  var time4 = moment.unix(1507593600).calendar(null, customFn);
  $('#displayTime1').text(time1);
  $('#displayTime2').text(time2);
  $('#displayTime3').text(time3);
  $('#displayTime4').text(time4);
});

.display {
  background-color: lightgray;
  width: 200px;
  height: 50px;
  padding: 10px;
  border: 1px solid black;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/moment.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<div class="display" id="displayTime1"></div>
<div class="display" id="displayTime2"></div>
<div class="display" id="displayTime3"></div>
<div class="display" id="displayTime4"></div>

您可以根据自己的用途修改calendar。从@krishnar获得差异解决方案。谢谢。

在Moment JS中自定义时间解析

2 个答案: