JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js"></script>
<script src="http://cl.ly/code/3A3Y0b1i0W0k/ember.js"></script>
<script type="text/x-handlebars" data-template-name="index">
  <div class="patient-view extended">
    {{#each controller}}
    <p>Name: {{name}}</p>
    {{/each}}    
  </div>
</script>

JavaScript

window.App = Em.Application.create();

App.Patient = Em.Object.extend({
  order: undefined,
  name: undefined
});

App.IndexView = Em.View.extend({
  click: function(){
    this.get('controller').set('sortAscending' !this.get('controller').get('sortAscending'));
  }
});

App.IndexController = Em.ArrayController.extend({
  sortProperties: ['order'],
  //sortAscending: false
});

App.IndexRoute = Em.Route.extend({
  model: function() {
    return Em.A([App.Patient.create({
      name: "Bert",
      order: 2
    }), App.Patient.create({
      name: "Ernie",
      order: 1
    })]);                
  }
});