I can’t figure out why I’m not able to bind an object to ng-model in choosen directive
Heres my HTMl content code:
<select class="form-control" required
multiple
ng-model="selectedItems"
ng-options="r.id as r.name for r in availableItems"
chosen>
</select>
The JSON:
$scope.selectedItems= [
{
"id": 1,
"name": "Selected 1",
"description": "Nulla adi architecto et",
},
{
"id": 2,
"name": "Selected 2",
"description": "test",
}
]
$scope.availableItems= [
{
"id": 1,
"name": "Available 1",
"description": "Nulla adi architecto et",
},
{
"id": 2,
"name": "Available 2",
"description": "test",
}
]
However I’m able to display the available items in the select drop down but my requirement: To display the selected items by default in the input box of choosen.
Reference:Localytics-Angular Choosen
Answer
Angular will automatically select the items by comparing them with the value of ng-model. In your case, the selected item is r.id, which is a primitive, so the equality will be based on comparing r.ids:
$scope.selectedItems = [1, 2];