Latest Ember + Data

HTML

<script src="https://github.com/downloads/emberjs/ember.js/ember-latest.js"></script>
<script src="https://github.com/downloads/emberjs/data/ember-data-latest.js"></script>
<script type="text/x-handlebars" data-template-name="items">
    {{#each item in controller}}
        {{view App.ItemView contentBinding="item"}}
    {{/each}}
</script>

<script type="text/x-handlebars" data-template-name="item">
    Item: {{item.label}}
</script>

CSS

.selected {
    background-color: #f88;
}

JavaScript

App = Ember.Application.create();

App.ItemsController = Ember.ArrayController.extend({
    selected: null
});

App.ItemsView = Ember.View.extend({
    templateName: 'items'
});

App.ItemView = Ember.View.extend({
    templateName: 'item',
    classNameBindings: ['isSelected:selected'],
    
    isSelected: function() {
        var item = this.get('content'),
            selected = this.getPath('controller.selected');
        return item === selected;
    }.property('item', 'controller.selected'),

    click: function() {
        var controller = this.get('controller'),
            item = this.get('content');
        controller.set('selected', item);
    }
});

App.ItemsView.create({
    controller: App.ItemsController.create({
        content: [{
            label: 'My first item'
        }, {
            label: 'My second item'
        }, {
            label: 'My third item'
        }]
    })
}).append();