javascript - Issue with dropdown boxes resetting to empty selection on change -

i'm having issue dropdown boxes using ng-model , changing index of dropdown while being still able use dropdown.

for instance, can change index of drop down using code (http://jsfiddle.net/q5hd6/357/). however, when change index defaults empty selection refuses let me select else.

html:

<select ng-model="recievedselect" ng-options="item.id item.name item in recievedoptions"></select> <button ng-click="changeindex()">change index</button> 

js:

    $scope.recievedoptions  = [                               {id : 0, name: "no"},                                {id : 1, name: "yes"}                              ];      $scope.changeindex = function()   {         $scope.recievedselect = $scope.recievedoptions[0];   } 

but if remove track item.id i'm able change indexes manually, can no longer change them button (http://jsfiddle.net/q5hd6/358/).

basically, both, sort of lost on go next.

it should $scope.recievedselect = $scope.recievedoptions[0].id; because select element's model contains value of selected option.

var myapp = angular.module('myapp',[]);    myapp.controller('myctrl', function($scope) {    $scope.recievedoptions  = [                               {id : 0, name: "no"},                                {id : 1, name: "yes"}                              ];                              $scope.changeindex = function() {        $scope.recievedselect = $scope.recievedoptions[0].id;    }  });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>  <div ng-app="myapp" ng-controller="myctrl">  <select ng-model="recievedselect" ng-options="item.id item.name item in recievedoptions"></select>  <button ng-click="changeindex()">change index</button>  </div>