I would like to display the selected value in the drop down in angularjs.
<!DOCTYPE html>
<html>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js">
</script>
<body>
<div><select class="form-control" size="30" style="
height:100px;width:100px" ng-model="value" ng-options="c.name for c
in customers track by c.id" ng-change="onChange">
<option value="" selected hidden />
</select></div>
</body>
</html>
By doing the above way it doesn't highlight the selected value.If I change the ng-options
as ng-options="c.id as c.name for c in customers track by c.id"
. In the value I see id
instead of name
.
You are missing ng-selected attribute, add attribute ng-selected="value" to your select element. And you don't need the option element, and also the track by statement needs to be removed.
<select class="form-control" size="30" style=" height:100px;width:100px"
ng-model="value" ng-selected="value"
ng-options="c.id as c.name for c in customers">
</select>