Emberjs使用sortProperties按日期对内容进行排序 [英] Emberjs sort content by date using sortProperties

问题描述

我正在尝试使用Emberjs sortProperties 在此 jsfiddle 。我的模型有一个 startTime 属性，我尝试对其进行排序，但是没有用。然后，我在控制器中创建了一个名为 todayEvent 的计算属性，该属性返回与传入日期匹配的事件，我尝试对它进行排序，但也没有用。我要做的就是列出当天发生的事件，但是以某种方式将发生事件的一天中的时间按升序排序，例如，应该列出在 10am 发生的事件

I am trying to use Emberjs sortProperties to sort content by date in this jsfiddle. My model has a startTime property which I tried to sort by but it didn't work. I then created a computed property called todayEvent in the controller which returns events that match the passed in date and I tried to sort that but it also didn't work. All I am trying to do is list events occurring on same day but in such a way that time of the day in chich event occurs is sorted in ascending order for example, an event occurring by 10am should be listed before those occurring by say 12pm.

这是 jsfiddle

This is the jsfiddle

模型：

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

控制器

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'),


});

fixtureAdapter

The fixtureAdapter

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 。

I managed to solve it @edu but thanks for trying to help. You can see a working 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('[e-mail]', 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;
    }

  })

这篇关于Emberjs使用sortProperties按日期对内容进行排序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！