Count items in array where expression is true

Question

I´m an angular newbie

I have a directive with a template that looks something like this:

<div class="multiselect-styled">
    <a href="javascript:void(0);" class="link" id="link-{{ model.ControlId }}">
        <span class="options-selected" id="selected-options-{{ model.ControlId }}">TEXT</span>
        <span class="select-arrows"></span>
    </a>
</div>

My model contains an array called Options which contains n number of selectable options. Each option object has a boolean property; Selected. I would like to replace TEXT with a string saying n options selected. So, how do I get the number of selected options?

Of course, using a loop one would do something like this but is there some way I kind bind directly to n in this case (Find n with an expression)?

            var n = 0;
            angular.forEach(model.Options, function(option) {
                if (option.Selected)
                    n++;
            });

UPDATE 1

Options look like this:

"Options": [
      {
        "Id": "ApprovedAndClosed",
        "Value": "ApprovedAndClosed",
        "Text": "ApprovedAndClosed",
        "Selected": false,
        "Code": "ApprovedAndClosed"
      },
      {
        "Id": "Cancel",
        "Value": "Cancel",
        "Text": "Cancel",
        "Selected": false,
        "Code": "Cancel"
      },
      {
        "Id": "Done",
        "Value": "Done",
        "Text": "Done",
        "Selected": false,
        "Code": "Done"
      },
      {
        "Id": "Init",
        "Value": "Init",
        "Text": "Init",
        "Selected": false,
        "Code": "Init"
      },
      {
        "Id": "ReadyForProcessing",
        "Value": "ReadyForProcessing",
        "Text": "ReadyForProcessing",
        "Selected": false,
        "Code": "ReadyForProcessing"
      },
      {
        "Id": "Rejected",
        "Value": "Rejected",
        "Text": "Rejected",
        "Selected": false,
        "Code": "Rejected"
      },
      {
        "Id": "Reminder",
        "Value": "Reminder",
        "Text": "Reminder",
        "Selected": false,
        "Code": "Reminder"
      }
]

Is it needed to be display in the view or just in your controller? — Alberto I.N.J.
– Alberto I.N.J., Commented Jun 30, 2015 at 10:00

Lukasz Wiktor · Accepted Answer · 2015-06-30 09:58:56Z

1

You can try using a filter:

{{(model.Options | filter:{'Selected': true}).length}}

answered Jun 30, 2015 at 9:58

Lukasz Wiktor

20.5k6 gold badges73 silver badges83 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

trees_are_great · Accepted Answer · 2015-06-30 09:59:41Z

0

You could use lodash for this:

var countSelected = _.filter(Options, { 'Selected': true});
console.log(countSelected.length);

See: codepen example

answered Jun 30, 2015 at 9:59

trees_are_great

3,9113 gold badges34 silver badges66 bronze badges

Collectives™ on Stack Overflow

Count items in array where expression is true

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related