Ember.JS - toggleProperty toggling all items in list -


i have toggleproperty in container toggle set of actions on each item. problem is, when toggle button on 1 item clicked, every item toggled, instead of 1 that's clicked.

i love know how toggle clicked item, not list.

i using ember-cli build application.

my category model:

import ds 'ember-data';  export default ds.model.extend({   pk: ds.attr('string'),   category: ds.attr('string'),   products: ds.hasmany('product'), }); 

my category route:

import ember 'ember';  export default ember.route.extend({   model: function() {     return this.store.findall('category');   }, }); 

my category controller

expand: function() {   this.toggleproperty('isexpanded', true); } 

my template:

{{#each model |i|}}       <tr>         <td>           <a {{action 'expand'}}>{{i.category}}</a>         </td>         <td>           {{i.pk}}         </td>         <td>           {{#if isexpanded}}             <button {{action "deletecategory"}}>edit</button>             <button {{action "deletecategory"}}>delete</button>           {{else}}             <button {{action 'expand'}}>actions</button>           {{/if}}         </td>       </tr>     {{/each}} 

since stackoverflow, not letting me post without adding more text, know how show products associated category, on same route (same page), clicking on each category?

cheers , thank you.

in controller:

expand(item) {   if (!item) {     return;   }   item.toggleproperty('isexpanded', true); } 

template:

{{#each model |i|}}       <tr>         <td>           <a {{action 'expand' i}}>{{i.category}}</a>         </td>         <td>           {{i.pk}}         </td>         <td>           {{#if i.isexpanded}}             <button {{action "deletecategory"}}>edit</button>             <button {{action "deletecategory"}}>delete</button>             products:             {{#each i.products |product|}}               {{product}}             {{/each}}           {{else}}             <button {{action 'expand' i}}>actions</button>           {{/if}}         </td>       </tr>     {{/each}} 

Comments