Here is the code snippet and information at hand:
$scope.options = [
{ id: 1, label: "My label" },
{ id: 2, label: "My label 2" }
];
$scope.selected = 2;
<select ng-options="opt.label for opt in options" ng-model="selected">
<option value="">Select one</option>
</select>
Nevertheless, the rendered options appear as follows:
<select ng-options="opt.label for opt in options" ng-model="selected">
<option value="">Select one</option>
<option value="0">My label</option>
<option value="1">My label 2</option>
</select>
The query now is - how can I designate My label 2 as the selected option? It's achievable by doing this:
$scope.selected = $scope.options[1];
However, my hurdle lies in the fact that these options are generated within a directive. At that instant, I lack knowledge of 1) the number of values in $scope.options, or 2) the index of the chosen option in the database. All that's known is the provided ID (within the object).
The HTML structure of my directive looks somewhat like this:
<select ng-switch-when="select" ng-model="form.model[element.model]" ng-options="{{element.rule}}"></select>
Where element.rule refers to:
rule: "role.role for role in element.options"
And element.options contains an array of available choices, with form.model[element.model] holding the ID of the selected option.
To determine the index of the element with ID X in the array $scope.options, what steps should be taken? The solution appears probable through this approach, but the method remains elusive...