Question

As you’ll be able to tell from my question, I’m slowly learning EmberJS. I’ve read the great guide on routes and I felt ready to take on the world but then…

In my example, I thought the {{somethingView}} would be rendered and not the controller property {{somethingCtrl}}. Is this the correct behaviour? If so how would you render a property from the Ember.View?

The JS

window.App = Ember.Application.create({
    ready: function() {
        this.initialize();
    }
});


window.App.Router = Ember.Router.extend({
    root: Ember.Route.extend({
        index: Ember.Route.extend({
            route: '/',
            connectOutlets: function(router) {
                var controller = router.get('applicationController');
                controller.connectOutlet('garments');
            }
        })
    })
})

window.App.ApplicationView = Ember.View.extend({
    templateName: 'application',
});

window.App.ApplicationController = Ember.Controller.extend();


window.App.GarmentsController = Ember.Controller.extend({
    somethingCtrl: "Something in the controller"
});

window.App.GarmentsView = Ember.View.extend({
    templateName: 'garments',
    somethingView: "Something in the view"
});​

The DOM stuff

<script type="text/x-handlebars" data-template-name="application">
  <h1>Hi Ember</h1>
    {{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="garments">
  <h1>Garments</h1>
    {{somethingView}}<br>
    {{somethingCtrl}}
</script>

​

​
The Fiddle

Answer 1

This behaviour is correct. These are my understandings of these ember core concepts:

• Model: These objects represent the date that is handled by your application. These are the business objects that form the domain model of your Application.
• Controller: A Controller is responsible for providing access to your models. Controllers have the property content, where models should be injected (a single Object for Ember.Controller and an array of objects for Ember.ArrayController). The Controller passes this content to your View. The Controller is the default context for your view. Therefore the behaviour you describe is expected.
• View: The View is just intended for displaying issues. I personally use it mainly to do jQuery animations.

But nonetheless it is possible to access the view instance in the template. You just have to use the variable with the name ‘view’ in your template. I updated your fiddle with a working example: http://jsfiddle.net/jPK8A/5/

<script type="text/x-handlebars" data-template-name="garments">
  <h1>Garments</h1>
    {{view.somethingView}}<br>
    {{somethingCtrl}}
</script>

But to be clear: The most common case should be to access contents from your controller. It should be not often that you access variables of your view. You want to display date in your App and this date resides in models and should therefore be accessed through controllers. The most likely case might be, that you want to store labels in your view or something like that (labels that have to be computed).