Ember.js Access parent controller within outlet template

Question

I'm pretty new to Ember and am struggling to work this out.

I have a Model, Huddle, as well as an associated Controller, the HuddlesController. There is a template huddles.hbs.erb which contains a single {{outlet}}. Under templates/huddles/ there are two files, grid.hbs.erb and list.hbs.erb. These are rendered into the outlet in huddles.hbs.erb.

Now within huddles.hbs.erb, I can use an each block that looks like this:

{{#each huddle in controller}}
  {{huddle.name}}
{{/each}}

And this works as expected, iterating over the collection of Huddles.

However, if I call the same code within list.hbs.erb or grid.hbs.erb, I get the following error:

Uncaught Error: assertion failed: an Ember.CollectionView's content must implement Ember.Array. You passed <(generated huddles.grid controller):ember405>

It seems that I am no longer in the correct scope! How do I access the collection in the parent controller (HuddlesController which extends from Ember.ArrayController)?

Thanks in advance!

MilkyWayJoe MilkyWayJoe · Accepted Answer · 2013-04-24T20:35:57

As per error message you should have a controller named HuddlesGridController which extends Em.ArrayController. Each route will have its own controller, view and template. This means that HuddlesController is used in the resource route (HuddlesRoute I'm assuming), but you're an a child route (HuddlesRoute I'm also assuming).

Ember.js Access parent controller within outlet template

1 Answers