Facing a simple problem and seeking a solution.
I am using ng-repeat to dynamically create select boxes with ng-options displaying the same values.
The ng-repeat is used to iterate through model options.
<div data-ng-repeat="condition in model.conditions">
<label>{{condition}}</label>
<select data-ng-model="selectedValue"
ng-options="item.name for item in optionList">
</select>
</div>
This represents the condition model:
$scope.model =
{
conditions:
[
{id:1,name:"CONDITION_ONE"},
{id:2,name:"CONDITION_TWO"}
]
}
This corresponds to the list of options:
$scope.optionList =
[
{id:1, name:"OPTION_ONE"},
{id:2, name:"OPTION_TWO"},
{id:3, name:"OPTION_Three"}
];
Image for illustration purposes only:
https://i.sstatic.net/yqnuf.png
I aim to enable the removal of selected items from one select box when chosen, in order to prevent duplicates across select boxes.
Is there a way to achieve this functionality using angularJS?