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>
hello
<script type="text/x-handlebars" data-template-name="usergroups">
<ul>
    {{#each controller}}
        <li>{{name}}
    {{/each}}
</ul>
</script>

JavaScript

var App = Ember.Application.create({});

window.MyApp = App;

App.UsergroupsRoute = Ember.Route.extend({
    model: function(params) {
        return [ 
            Ember.Object.create({id: 1, name: 'foo'}), 
            Ember.Object.create({id: 2, name: 'bar'}) 
        ];
    }
});

App.UsergroupsGroupsController = Ember.ArrayController.extend({
    sortProperties: ['name'],
    sortAscending: true,
});

App.Router.map(function(){
   this.resource('usergroups', {path: '/'});
});