Choose a default option ng-option in angular.js

Question

Thanks for reading my question. I know there are similar questions, but I have not solved my question, so I publish my question. I want to assign a value to the dropdown, by clicking on some of the hyperlink options. The problem is that I can never choose any value.

<select class="form-control" ng-model='obj.animal' id='animal' name='animal'  
    ng-options="opt as opt.animal for opt in aAnimals  track by opt.animal">
          <option style="display:none" value="">Select an animal</option>
</select>

<div ng-repeat='item in aAnimals'>
 <a href='' ng-click='changeval($index)' >{{item.animal}}</a>
</div>

//********controller********//

$scope.obj = {}
$scope.aAnimals=[{ "animal": "cat", "color": "white"},{ "animal": "dog", "color": "black"}]

$scope.changeval=function(index){
  $scope.obj.animal=$scope.aAnimals[index].animal;
}

http://plnkr.co/edit/8z51qlqfodGSRA1Rv3UH?p=preview

Possible duplicate of How to have a default option in Angular.js select box — Sarantis Tofas
– Sarantis Tofas, Commented Dec 27, 2016 at 0:25

Hoyen · Accepted Answer · 2016-12-27 00:11:35Z

2

The options are the items in the array. So you need to change the line to this:

$scope.obj.animal=$scope.aAnimals[index]; // Remove .animal

answered Dec 27, 2016 at 0:11

Hoyen

2,5291 gold badge14 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Choose a default option ng-option in angular.js

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related