After Render

by ethan_selzer

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0-rc.3/handlebars.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ember.js/1.0.0-rc.1/ember.js"></script>
<script type="text/x-handlebars" data-template-name="application">
    <h1>Application Template</h1>
    {{ outlet }}
</script>

<script type="text/x-handlebars" data-template-name="index">
    <h2>Index Template</h2>
    {{view App.CV contentBinding="model"}}
</script>

<script type="text/x-handlebars" data-template-name="item">
    <p>{{view.content.color}}</p>
</script>

CSS

body {
  padding: 2em;   
}

JavaScript

App = Ember.Application.create();
App.IndexRoute = Ember.Route.extend( {
    model : function(){
         return Ember.A( [
             Ember.Object.create( { color : 'green' } ),
             Ember.Object.create( { color : 'blue' } )
         ] );
    }
} );
App.CV = Ember.CollectionView.extend( {
    itemViewClass : Ember.View.extend( {
        templateName : 'item',
        //contentBinding : 'parentView.model'
    } ),
    didInsertElement : function(){
        console.log( 'length: ', this.$( 'p' ).length );
    }
} );