Reputation: 177
I'm trying to set up a relationship between a parent ArrayController and a child ObjectController using the 'needs' syntax described in this Ember guide - http://emberjs.com/guides/controllers/dependencies-between-controllers/
When I try to access the controllers object to get a reference to the parent from the child I get a 'controllers object undefined' error. Any help appreciated!
Ember version RC4
Template:
<script type="text/x-handlebars" data-template-name="gigs">
<div> // code simplified
{{#each controller itemController="gig"}}
{{#view App.GigView contentBinding="this"}}
<div class="tile">
<img {{bindAttr src="photo_url"}} />
{{#if widgetDisplayed}}
// widget view
{{/if}}
</div>
{{/view}}
{{/each}}
</div>
</script>
Javascript:
App.GigsController = Ember.ArrayController.extend({
anyWidgetDisplayed: false,
isAnyWidgetDisplayed: function() {
return anyWidgetDisplayed;
}
});
App.GigController = Ember.ObjectController.extend({
needs: ["gigs"],
widgetDisplayed: false,
displayWidget: function() {
console.log(controllers.gigs);
if (!controllers.gigs.isAnyWidgetDisplayed) {
this.set("widgetDisplayed", true);
}
}
});
Upvotes: 2
Views: 3402
Reputation: 1463
When you use a controller via needs, you should get the controller using the get function,
displayWidget: function() {
var gigsController = this.get('controllers.gigs')
console.log(gigsController);
if (!gigsController.get('isAnyWidgetDisplayed')) {
this.set("widgetDisplayed", true);
}
}
Alternatively when you use itemController, you need not to use needs to get the parentController, you can use the parentController property
App.GigController = Ember.ObjectController.extend({
widgetDisplayed: false,
displayWidget: function() {
var gigsController = this.get('parentController');
console.log(gigsController);
if (!gigsController.get('isAnyWidgetDisplayed')) {
this.set("widgetDisplayed", true);
}
}
});
Refer: this pull request
Upvotes: 2