javascript - Emberjs 使用 sortProperties 按日期对内容进行排序

标签 javascript ember.js ember-data

我正在尝试使用 Emberjs sortProperties 在此 jsfiddle 中按日期对内容进行排序。我的模型有一个 startTime 属性,我试图对其进行排序,但没有成功。然后我在 Controller 中创建了一个名为 todayEvent 的计算属性,它返回与传入日期匹配的事件,我试图对其进行排序,但它也没有用。我想要做的就是列出同一天发生的事件,但是以这样一种方式,即一天中发生的事件按升序排序,例如,应该列出 10am 发生的事件在 12pm 发生之前。

这是 jsfiddle

模型:

App.TimeSlot = DS.Model.extend( {
  startTime: DS.attr('date'),
  endTime: DS.attr('date'),
  allDay: DS.attr('boolean'),
  soldOut: DS.attr('boolean')
});

Controller

App.TimeSlotController = Ember.ArrayController.extend({
 content: [ ],

 sortProperties: ['todayEvent'],
 sortAscending: true,

 day: Ember.A(['2013-10-25']),

 todayEvent: function(){
  self = this;
  u = self.get('content'); 
  console.log('u', u);
  kl =  u.filter(function(availableSlot) {
   console.log ('a', availableSlot.get('startTime') );

 return (moment(availableSlot.get('startTime')).format("YYYY-MM-DD") ==  self.get('day').toString() );
  }); 

   return kl;  
 }.property('day', 'content@each'),


});

夹具适配器

App.TimeSlot.FIXTURES = [

  {
    id: 3,
    startTime: moment.utc('2013-10-25T12:30:00+01:00',"YYYY-MM-DD HH:mm:ss" ),    
    allDay: true
  },

 {
   id: 4,
   startTime: moment.utc('2013-10-25T10:10:00+01:00',"YYYY-MM-DD HH:mm:ss" ),    
   allDay: true
},

 {
  id: 5,    
  startTime: moment.utc('2013-10-23 00:00 +01:00', "YYYY-MM-DD HH:mm"),    
  allDay: true
 }
];

最佳答案

我设法解决了它 @edu 但感谢您的帮助。你可以看到一个工作 jsfiddle .

有两种方法,都使用 Ember.computed.sort:

 sortedTime: Ember.computed.sort('todayEvent',       function(a, b){

    if (
      moment(Ember.get(a, 'startTime') ) >  moment(Ember.get(b, 'startTime') ) 
    ){

   //returns morning timings before afternoon timings
   //api doc says return 1 when 'a' should come after 'b'
   //http://emberjs.com/api/#method_computed_sort

   return 1;

   } else if ( 
      moment(Ember.get(a, 'startTime') ) <   moment(Ember.get(b, 'startTime') ) 
   )
   {
    //returns afternoon timings before morning timings
   //api docs says return -1, when 'a' should come before 'b'
    return -1;
   }
     return 0;

  })

第二种方法

  //adapted from http://jsbin.com/OjoXOqE/9/edit

  sortedContent: Ember.computed.sort('content.@each.startTime', function(a, b){

    //the this keyword does not work here, 
    //throws "Object #<Object> has no method 'get'"
    //so we use the Ember keyword to get it working

   var ap = moment(Ember.get(a, 'startTime')),
       bp = moment(Ember.get(b, 'startTime'))

  //we return morning before afternoon times 
    if(ap !== bp) {
      return ap - bp;
    }

  })

关于javascript - Emberjs 使用 sortProperties 按日期对内容进行排序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19903389/

相关文章:

javascript - ASP .NET div 淡入

javascript - 全日历 View 显示 goToDate 中断上一个、下一个和今天

ember.js - Ember CLI构建被杀死

javascript - 如何在 Ember.js 中销毁转换时的路线模型

javascript - 在javascript中将文件内容读入字符串的最基本方法

javascript - Uncaught ReferenceError : createReactClass is not defined

javascript - 转换回原点路线

javascript - 简单的 Ember.js `has-many` 关系不起作用

ember.js - 查找操作(AJAX 请求)被拒绝,未在线路中看到

javascript - Ember Data 在提交时不发送数据