Take the 2-minute tour ×

I'm trying to render a view Team inside of an {{outlet}}. This Team view is comprised of a simple Person view (the team leader), and a collection of Person views (team members). The outlet is set up by calling connectOutlet() on the ApplicationController.

Although the Person child views are rendered in the markup as expected, all the values of name are missing. It sure seems like my bindings and/or controller are not set up properly. What am I missing?

Code and demo: http://jsfiddle.net/aek38/fkKFJ/

The relevant handlebar templates are:

<script type="text/x-handlebars" data-template-name="app">
    <div class="container">

<script type="text/x-handlebars" data-template-name="person">
    <em>Person name is:</em> {{name}}

<script type="text/x-handlebars" data-template-name="team">
    <h3>Team Leader</h3>
    <em>Leader name should be:</em>{{leader.name}}
    {{view App.PersonView contentBinding="leader"}}
    <h3>Team Members</h3>
    {{#collection contentBinding="members"}}
        {{view App.PersonView contentBinding="content"}}

Code snippet:

App = Ember.Application.create({
ready: function() {
ApplicationController: Ember.Controller.extend(),
ApplicationView: Ember.View.extend({
    templateName: "app"

Person: Ember.Object.extend({
    name: "Jane Doe"
PersonController: Ember.ObjectController.extend(),
PersonView: Ember.View.extend({
    templateName: "person"

Team: Ember.Object.extend({
    members: [],
    leader: null
TeamController: Ember.ObjectController.extend(),
TeamView: Ember.View.extend({
    templateName: "team"
// ...
share|improve this question

3 Answers 3

up vote 2 down vote accepted

You can use

{{view App.PersonView contextBinding="leader"}}

and use {{#each}} instead of {{#collection}} for the members


share|improve this answer
Aha, thanks! I needed to use context, not content. One character makes all the difference in the world (as it always does). –  Alan Kendall Jul 25 '12 at 12:44
Why use {{each}} over {{collection}}? My impression was that both are ok, but admittedly I can't tell whether {{collection}} is officially recommended anymore and/or will survive in ember's future. –  Alan Kendall Jul 25 '12 at 12:51

Not very sure whats going on but I tweaked your fiddle to get it working:


Seems as if bindings are not working properly in the sense:


works but



Sorry but I couldn't work it out more.

share|improve this answer
Also noticed that you are using ember-latest and handlebars beta. Have you tried with old more stable versions? –  Rajat Jul 25 '12 at 7:09
I like to live dangerously. No, actually, I wanted to use connectOutlets on my routes, which is not available in yet. –  Alan Kendall Jul 25 '12 at 13:06

You're setting the content variable on person view via contentBinding that should probably be personBinding. And then in your template you should get the view.person.name.

{{collection}} should be a {{each}} block.

{{#each members}}
    {{view App.PersonView personBinding="this"}}

And this person template will look in the right location for the name.

    <em>Person name is:</em> {{view.person.name}}

Didn't change your js.

fiddle: http://jsfiddle.net/albertjan/fkKFJ/9/

share|improve this answer

Your Answer


