Angular group comma separated values in select options

Question

i'm having this problem i can't group this comma separated values in select dropdown options, here is my code:

here is the model:

Angular code:

<select ng-model="attrModel" ng-options="option.Value group by option.Key.Name for option in attrModel track by option.Value"></select>

Result:

Expceted Result:

Answer 1

The problem is that you pass the whole Value array as the value to the <option> tag.

I am not 100% sure how to handle nested arrays within a select properly but you can use <optgroup> for it.

<select ng-model="myFixedSelection">
  <optgroup ng-repeat="group in attrModel track by $index" label="{{group.Key.Name}}">
    <option ng-repeat="value in group.Value track by $index" >{{ value }}</option>
  </optgroup>
</select>

See the working plnkr