How to select default dropdown option in angularjs?

Question

how to select dropdown in angularjs ?

How to select default dropdown option for "Third Project 456"

Please Check :jsfiddle

HTML:

<select ng-change="getMileWorkerlist(broadcastManagerData.project_list)" ng-model="broadcastManagerData.project_list" name="project_list" class="form-control" required >
<option value="0">All Project</option>
<option ng-repeat="(key, value) in projectList" ng-value="key">{{value}}</option>
</select>

JAVASCRIPT:

$scope.projectList = {
35: "Third Project 456",
56: "Project-11-1-2016",
76: "test project for cbs"
};
$scope.broadcastManagerData.project_list =35;

Make my html in view source:

<select class="form-control ng-pristine ng-valid ng-valid-required ng-touched" required="" name="project_list" ng-model="broadcastManagerData.project_list" ng-change="getMileWorkerlist(broadcastManagerData.project_list)">
<option value="? number:35 ?"></option>
<option ng-selected="true" ng-value="0" value="0" selected="selected">All Project</option>
<option class="ng-binding ng-scope" ng-value="key" ng-repeat="(key, value) in projectList" value="35">Third Project 456</option>
<option class="ng-binding ng-scope" ng-value="key" ng-repeat="(key, value) in projectList" value="56">Project-11-1-2016</option>
<option class="ng-binding ng-scope" ng-value="key" ng-repeat="(key, value) in projectList" value="76">test project for cbs</option>
</select>

OUTPUT:

Please Check :jsfiddle

Answer 1

Well I know why my comment was not working, I assumed (didn't read question carefully) that you were working with an array, and you're not. I do not know how to do it using (key, value), but why are you not using an array? If you were, this would work:

<select ng-change="getMileWorkerlist(broadcastManagerData.project_list)"
  ng-model="broadcastManagerData.project_list"
  ng-init="broadcastManagerData.project_list = projectList[0].key" 
  name="project_list"  class="form-control" required 
  ng-options="item.key as item.value for item in projectList">
</select>

and in controller, the array:

$scope.projectList = [
    {key: 35, value: "Third Project 456"},
    {key: 56, value: "Project-11-1-2016"},
    {key: 76, value: "test project for cbs"}
];

But as I said, seems like this way only works with an array. Any reason why you can't do it this way?

Answer 2

<div ng-app="myApp" ng-controller="Ctrl" ng-init="broadcastManagerData.project_list = 'Third Project 456'">
     <select ng-model="broadcastManagerData.project_list"  >
      <option value="0">All Project</option>
      <option ng-repeat="(key, value) in projectList" ng-value="value" ng-selected="value=='Third Project 456'">{{value}}</option>
    </select>
    {{broadcastManagerData.project_list}}
</div>

Answer 3

Please check if the below will help:

<option ng-repeat="(key, value) in projectList" ng-value="key" ng-selected="value == 'Third Project 456'">{{value}}</option>

Answer 4

<select ng-change="getMileWorkerlist(broadcastManagerData.project_list)" ng-model="broadcastManagerData.project_list" name="project_list" class="form-control" required >
<option value="0">All Project</option>
<option ng-repeat="(key, value) in projectList" value="{{key}}">{{value}}</option>
</select>