简体   繁体   English

在骨干/ Javascript中按24小时制对时间进行自定义排序

[英]Custom Sorting By 24-hour clock Time in Backbone/Javascript

I have backbone collection which consists of dates and 24-hour clock times. 我有由日期和24小时制时钟组成的骨干集合。 I would like to be able to sort my collection by time. 我希望能够按时间对我的收藏进行排序。

So since a normal sort functionality would sort (as an example) 1:00, 17:00, and 19:00 as such, I am trying to display 17:00, 19:00, 1:00 in that order. 因此,由于正常的排序功能会像这样对1:00、17:00和19:00进行排序(例如),因此我尝试按该顺序显示17:00、19:00和1:00。 1:00 of the next day proceeds 19:00 in time, in this case. 在这种情况下,第二天的1:00在时间19:00进行。

Since this case only occurs when a value is less than or equal to 12, the simplest solution seems to be: sort those values greater than 12; 由于这种情况仅在值小于或等于12时发生,因此最简单的解决方案似乎是:对大于12的值进行排序; sort values less than 12; 排序值小于12; append sorted values less than 12 to values greater than 12. So two separate sorted lists. 将小于12的排序值附加到大于12的值。因此,两个单独的排序列表。

    comparator: function( a, b ) {
                if(!this.sortColumn ) return 0;
                    if(sortColumn == 'time') {
    switch (a.get('time')) {
                case a > 12: return 1;
                case a <= 12: return 2;
            }
      }
}

This is a rough idea that I've had. 这是我的一个粗略想法。 This doesn't sort the two respective groups. 这不会对两个组进行排序。 The idea being that the case where it's greater than 12 precedes the case where it's less than 12, but they will be unsorted. 想法是大于12的情况先于小于12的情况,但是它们将不进行排序。

EDIT: Note that all the events occur after 12:00 PM on Day 1 and before 12:00 PM of the next day, Day 2. This is why dates like 1:00 will be after dates like 19:00. 编辑:请注意,所有事件都在第1天的第1天的12:00 PM之后和第二天的第二天的12:00 PM之前发生。这就是为什么像1:00这样的日期将在像19:00这样的日期之后。

Any advice would be fantastic. 任何建议都太棒了。

Thanks 谢谢

You can define your comparator function as a "sortBy" : 您可以将比较器函数定义为“ sortBy”

"sortBy" comparator functions take a model and return a numeric or string value by which the model should be ordered relative to others. “ sortBy”比较器函数采用一个模型,并返回一个数字或字符串值,通过该数字或字符串值可以相对于其他模型对模型进行排序。

The goal is then to produce a sorting value that corresponds to your requirements. 然后目标是产生与您的需求相对应的排序值。 As @Pointy noted in the comments, adding 24 to the times before 12:00 would do the trick 正如@Pointy在评论中指出的那样,在12:00之前的时间加上24可以解决问题

For example 例如

var C = Backbone.Collection.extend({

    comparator: function (m) {
        var t = m.get('time'),
            h = parseInt(t.substr(0, 2), 10),
            m = parseInt(t.substr(3), 10);
        if (h<12) h = h+24;

        return h *60 + m;
    }

});

var c = new C([
    {time: '01:17'},
    {time: '01:00'},
    {time: '12:00'},
    {time: '07:00'},
    {time: '15:00'}
]);

console.log(c.pluck('time'));

http://jsfiddle.net/nikoshr/5srqn5b4/ http://jsfiddle.net/nikoshr/5srqn5b4/

I dont see the issue with just ordering them by the actual number.. 我没有看到仅按实际数字订购它们的问题。

var times = [];
// generate some data..
// [1:00, 1:30, 2:00 ...]
for(var i=0; i < 24; i++){times.push(i.toString() + ':00');
times.push(i.toString() + ':30')}
// standard sorting
console.log(_.sortBy(times, function(num){ return num}))
> ["0:00", "0:30", "10:00", "10:30", "11:00", "11:30", "12:00", "12:30", "13:00", "13:30", "14:00", "14:30", "15:00", "15:30", "16:00", "16:30", "17:00", "17:30", "18:00", "18:30", "19:00", "19:30", "1:00", "1:30", "20:00", "20:30", "21:00", "21:30", "22:00", "22:30", "23:00", "23:30", "2:00", "2:30", "3:00", "3:30", "4:00", "4:30", "5:00", "5:30", "6:00", "6:30", "7:00", "7:30", "8:00", "8:30", "9:00", "9:30"]
// improved sorting
console.log(_.sortBy(times, function(num){ var key = parseInt(num.split(':')[0]); if (key >= 12) {return key - 12} return key + 20 }))
> ["12:00", "12:30", "13:00", "13:30", "14:00", "14:30", "15:00", "15:30", "16:00", "16:30", "17:00", "17:30", "18:00", "18:30", "19:00", "19:30", "20:00", "20:30", "21:00", "21:30", "22:00", "22:30", "23:00", "23:30", "0:00", "0:30", "1:00", "1:30", "2:00", "2:30", "3:00", "3:30", "4:00", "4:30", "5:00", "5:30", "6:00", "6:30", "7:00", "7:30", "8:00", "8:30", "9:00", "9:30", "10:00", "10:30", "11:00", "11:30"]

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM