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

​

App.IndexRoute = Ember.Route.extend({

  model: function(){

      return [

          {firstName: 'Kris', lastName: 'Selden'},

          {firstName: 'Luke', lastName: 'Melia'},

          {firstName: 'Formerly Alex', lastName: 'Matchneer'}

      ];

  }

});

​

App.EditorView = Ember.View.extend({

  templateName: 'editor-view',

  topView: Ember.ContainerView.extend(),

  bottomView: Ember.ContainerView.extend(),

  CodeMirrorView: Ember.TextArea.extend({  

    didInsertElement: function() {      

      this.codeMirror = CodeMirror.fromTextArea(this.get('element'));                  

    }

  })

});

​

App.MyComponent = Ember.View.extend({

  templateName: 'click-here',

  message: null,

  click: function() {

    alert(this.get('message'));

  }

});

​

App.MyEditorView = App.EditorView.extend({  

  didInsertElement: function() {

    this._super();

    this.get('topViewInstance').pushObject(App.MyComponent.create({ message: "Hello" }));

    this.get('bottomViewInstance').pushObject(App.MyComponent.create({ message: "World" }));

  }

});