JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.js"></script>
<script src="http://builds.emberjs.com/canary/ember.js"></script>
<script src="http://builds.emberjs.com/canary/ember-data.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.1.0/moment.min.js"></script>
<script type="text/x-handlebars" data-template-name="timeSlot">
    <h4>sorted todayEvent property by time</h4>
        {{#each item in sortedTime}}
    {{weekday item.startTime}} <br/>
    {{/each}}
    
    <h4>sorted content by time</h4>
        {{#each item in sortedContent}}
    {{weekday item.startTime}} <br/>
    {{/each}}
    
    <h3>Not sorted section</h3>
    <h4>todayEvent's should contain 2 dates </h4>
    {{#each todayEvent}}
       timeSlot: {{weekday startTime}} 
     <br/>
    {{/each}}
    <br/>
    
     <h4> the controller arrangedContent without computed property</h4>
     {{#each arrangedContent}}
     {{startTime}} <br/>
     {{/each}}
    
     <h4>rendering with  Itemcontroller </h4>
     {{#each time in controller}}
        {{#each todayEvent}}
          timeSlot: {{weekday startTime}} 
          <br/>
        {{/each}}
     {{/each}}
    
    {{outlet}}
</script>

JavaScript

App = Ember.Application.create({
  LOG_TRANSITIONS: true
});


App.TimeSlotController = Ember.ArrayController.extend({
    content: [ ],
    day: Ember.A(['2013-10-25']),
    itemController: 'time',
   
  sortedTime: Ember.computed.sort('todayEvent',       function(a, b){
      
    if (
        moment(Ember.get(a, 'startTime') ) >  moment(Ember.get(b, 'startTime') ) 
        ){
        
  //returns moring 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
        
      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;
      }
      
    }),
   
    /*
    sortProperties: ['startTime'],
    sortAscending: true,
     sorted: Ember.computed.sort('@this', 'sortProperties'),
    */
    
    /*
    timeSorting: ['startTime'],
    //sortedTime: Ember.computed.sort('content.@each.startTime', 'timeSorting'),
    //sortedTime: Ember.computed.sort('todayEvent', 'timeSorting'),
    */
                                          
    todayEvent: function(){
      self = this;
        console.log('sortedTime', self.get('sortedTime') );
      //u = self.get('content'); 
        u = self.get('arrangedContent'); 
      console.log('u', u);
    kl =  u.filter(function(availableSlot) {
  ...