How do I set default value of select box in angularjs


I have a form that is used to edit a object and I can’t select a value in the select box.

I have a json array which represents the to be edited and look like this:

$scope.item = [{
    "objectID": "76",
    "versionID": "0",
    "versionName": "CURRENT",
    "objectName": "xyz",

now I am at the same time populating a select box from another json array that looks like this:

$scope.versions = [
    "id": "0",
    "description": "CURRENT",
    "name": "CURRENT"
    "id": "114",
    "description": "description of Version 2",
    "name": "version2"
    "id": "126",
    "description": "description of Version 3",
    "name": "version3"
    "id": "149",
    "description": "description of Version 4",
    "name": "version4"

inside my webpage I am creating the select box as follows:

Version: <select ng-model="item.versionID"
                 ng-options=" for version in versions"

the select box is populating for me but it should be selecting the the value that matches the version in item. I have tried both versionID and versionName, I have even tried setting ng-selected="0" and that doesn’t even work.

I have looked here on SO, the Angularjs site and googled and gone through countless tutorials but still having issues with this. I just can’t seem to see what the issue is so any Help greatly appreciated

JSFiddle Added

Added a JsFiddle here


You can simple use ng-init like this

<select ng-init="somethingHere = options[0]" ng-model="somethingHere" ng-options=" for option in options"></select>

Answered By – aemonge

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published