CODEWITHSUNDEEP
ember.js
rjoxford
rjoxford

Reputation: 361

Add local controller property to store models

I want to add a simple 'selected' property to store objects, just localised to the particular route/controller.

So in my controller I'm loading the 'groups' from the store. For each 'group' I want to add in a 'selected' property. Tried a few different approaches but just can't get it working.

Advice on "the ember way" would be much appreciated.

Upvotes: 3

Views: 24

Answers (1)

casafred
casafred

Reputation: 666

If what you're trying to do is display something different for each group that isSelected. I'd take the following approach:

I'd create an array on your controller of selectedGroups, which can either be an array of group objects from the store or just simply an array of ids. As a group is selected/unselected, it can be added to/removed from the array. You can then use a computed function or pass selectedGroups into components to do whatever you need with selectedGroups.

So, if you had your groups template like so:

{{#each model as |group|}}
  {{my-item-component item=group selectedItems=selectedGroups}}
{{/each}}

Then in your my-item-component.js, you would have a computed function like:

isSelected: computed('item', 'selectedItems.[]', function () {
   // This assumes selectedItems contains item/group objects rather
   // than ids. You will need to tweak a little for ids.
   return (this.get('selectedItems').indexOf(this.get('item')) !== -1);
})

Upvotes: 1

Related Questions