JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.0.beta.6.js"></script>
<script src="https://raw.github.com/emberjs/ember-rails/master/vendor/ember/development/ember.js"></script>
<script src="https://raw.github.com/emberjs/ember-rails/master/vendor/ember/development/ember-data.js"></script>
<script type="text/x-handlebars" data-template-name="application">
    <h1>Here</h1>
    {{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="home">
    <h2>Nodes</h2>
    <ul>
    {{#each node in nodes}}        
        {{view Zik.NodeView nodeBinding="node" class="node"}}
    {{/each}}
    </ul>
</script>

<script type="text/x-handlebars" data-template-name="node">
        Node: {{view.node.name}}
        {{view Zik.LeafsView leafsBinding="node.leafs" class="leafs"}}
</script>

<script type="text/x-handlebars" data-template-name="leafs">
    {{#each leaf in view.leafs}}            
        {{view Zik.LeafView leafBinding="leaf" class="leaf"}}
    {{/each}}
</script>

<script type="text/x-handlebars" data-template-name="leaf">
        Leaf: {{view.leaf.name}}
    <a href="#" {{action change target="view"}}>Change</a>
</script>

JavaScript

Zik = Ember.Application.create();
Zik.Store = DS.Store.extend({
  revision: 4,
  adapter: DS.fixtureAdapter
});

Zik.Node = DS.Model.extend({
    id : DS.attr('number'),
    name : DS.attr('string'),
    leafs : DS.hasMany('Zik.Leaf', {key : 'leaf_ids'})
});
Zik.Leaf = DS.Model.extend({
    id : DS.attr('number'),
    name : DS.attr('string'),
    node : DS.belongsTo('Zik.Node')
});

Zik.Node.FIXTURES = [
    {
        id: 1,
        name: 'Node 1',
        leaf_ids: [1, 2, 3]
    },
    {
        id: 2,
        name: 'Node 2',
        leaf_ids: [4, 5, 6]
    },
    {
        id: 3,
        name: 'Node 3'
    }    
]
    
Zik.Leaf.FIXTURES = [
    {
        id: 1,
        name: 'Leaf 1.1',
        node_id: 1
    },
    {
        id: 2,
        name: 'Leaf 1.2',
        node_id: 1
    },
    {
        id: 3,
        name: 'Leaf 1.3',
        node_id: 1
    },
    {
        id: 4,
        name: 'Leaf 2.1',
        node_id: 2
    },
    {
        id: 5,
        name: 'Leaf 2.2',
        node_id: 2
    },
    {
        id: 6,
        name: 'Leaf 2.3',
        node_id: 2
    }            
]
    

Zik.ApplicationController = Ember.Controller.extend();
Zik.ApplicationView = Ember.View.extend({
    templateName: 'application'
});

Zik.HomeController = Ember.Controller.extend({
    
    nodes: function(){
        console.log('BEFORE should log this atleast 3x', this.get('content.length'))
        this.get('content').forEach(function(item, idx, en){
            console.log('should log this atleast 3x')
        })
        console.log('AFTER should log this atleast 3x', this.get('content.length'))
        return this.get('content')
    }.property('content.@each')

})

                Zik.HomeView = Ember.View.extend({
    templateName: 'home'               
});

Zik.NodeController = Ember.Controller.extend({});
        
Zik.NodeView = Ember.View.extend({
    templateName: 'node',
    tagName: 'li'
});
        
Zik.LeafsController = Ember.Controller.extend({});
       ...