Ember 0.9.8.1 Template

HTML

<script src="https://github.com/downloads/emberjs/ember.js/ember-0.9.8.1.js"></script>
<script type="text/x-handlebars">
    {{#view App.Menu id="Menu"}}
    {{/view}}
    {{view App.SimilarItem id="some-id" tagName="li"}}
    {{view App.SimilarItem id="some-id" tagName="li"}}
    {{view App.SimilarItem id="some-id" tagName="li"}}
    {{view App.SimilarItem id="some-id" tagName="li"}}
    {{view App.SimilarItem id="some-id" tagName="li"}}
    {{view App.SimilarItem id="some-id" tagName="li"}}
</script>

JavaScript

App = Ember.Application.create();

App.Menu = Ember.CollectionView.extend({
    tagName: 'ul',
    content: [
        Ember.Object.create({
            id: 'addChild',
            text: 'Als Kind Knoten'
        }),
        Ember.Object.create({
            id: 'addChild',
            text: 'davor einfuegen'
        }),
        Ember.Object.create({
            id: 'addChild',
            text: 'danach einfuegen'
        })
    ],

    itemViewClass: Ember.View.extend({
        template: Ember.Handlebars.compile("the letter: {{content.text}}"),
        attributeBindings: ['href'],
        href: function() {
            return this.getPath('content.id');
        }.property('content.id'),
        click: function(event) {
            alert('Clicked: ' + this.getPath('content.id'));
        }
    })
});


App.SimilarItem = Ember.View.extend({
    template: Ember.Handlebars.compile("<p>similar item</p>")
});