CODEWITHSUNDEEP
ember.js
ptmoy2
ptmoy2

Reputation: 413

how to add property to an EmberJS arrayController

How do I go about adding a controller property to each item in an arrayController?

For example, if I named the property "isExpanded", I want to be able to do something like this in the template:

{{#each controller}}
    {{#if isExpanded}}
        expanded content
    {{else}}
        non-expanded content
    {{/if}}
{{/each}}

Please note that I cannot use an ObjectController in the real application; please see my comment after Kingpin2's respond below.

Upvotes: 1

Views: 162

Answers (1)

Kingpin2k
Kingpin2k

Reputation: 47367

Use an item controller, and add the property to the item controller. It is a controller that will be used for each item in the controller list.

App.ColorsController = Em.ArrayController.extend({
  itemController: 'color'
});

App.ColorController = Em.ObjectController.extend({
  isExpanded: false
});

http://emberjs.jsbin.com/iSaJELug/2/edit

If you are talking about arraycontroller scope of the isExpanded, it's just as simple:

http://emberjs.jsbin.com/iSaJELug/3/edit

{{#each item in controller}}
  {{#if controller.isExpanded}}
    <li>Color: {{item.color}} and Class: {{item.class}}</li>
  {{else}}
    <li>Color: {{item.color}}</li>
  {{/if}}
{{/each}}

App.IndexController = Em.ArrayController.extend({
  isExpanded: false,
});

One last note, when you just say {{each controller}} you are changing the scope from the controller being in scope to the item being in scope, and if you wanted to access the controller properties you would then need to qualify the property with controller.isExpanded.

Upvotes: 1

Related Questions