I have 2 models: Post and Category. Post belongs to a Category and a Category has many Posts. Both models have an attribute cover wich contains a url to an image.
In my template I want to use a computed property ‘coverImage’ based on the cover of a post or if this is not present the cover image of the related category. My solution for this is the following:
post_controller.js
coverImage: function() {
if (this.get('cover')) {
cover = this.get('cover');
} else if (this.get('category')) {
cover = this.get('category').get('cover');
} else {
cover = 'images/categories/green_bg.png';
}
return 'background-image: url(' + cover + ')';
}.property(),
But to be able to access the category in my controller I have to set it up in my PostRoute:
post_route.js
setupController: function(controller, model) {
controller.set('model', model);
var category_id = model.get('category').get('id');
this.store.find('category', category_id).then(function(c) {
controller.set('category', c);
})
},
Having to access a related category through store.find + waiting for the promise to fullfill feels not right. Am I missing out on some essential Ember logic and is there a much better way to accomplish my coverImage helper property?