AngularJS: refresh ng-options when property source object changes -

full description: have list of options multiple properties (not key-value pair):

[   {     id: 1,     name: "111",     some: "qqq"   },   {     id: 2,     name: "222",     some: "www"   } ]; 

and select defined as:

<select name="myselect" id="myselect"   ng-options="option.name option in opts track option.id"   ng-model="mod1"></select> 

depending on app logic, property may change:

{   id: 2,   name: "222",   some: "www1" } 

but actual list in select doesn't change! however, if name changes, entire optionlist refreshed.

in short can see demo on jsfiddle or jsfiddle. prepared 2 similar examples:

1. when button clicked property updates
2. when button clicked - both property , key receive new value

does know solution?

update

for i'm solving issue update + delay + update solution:

this.click = function(){   $scope.opts = {};   $timeout(function() {     $scope.opts = { /* new object */};   }, 0); } 

ok, think understand want, able select option nested values may have changed since list rendered in dom.

based on understanding, believe plunker have created illustrates solution you. if select 1 of options, , change child value in input field, two-way binding update model.

basically, taking users selection, , on select change, re-assigning selected object reference original option in options array. allow two-way binding occur. if view code, see input fields updating option list ($scope.options), where-as model being displayed $scope.formdata.model.

https://plnkr.co/edit/dlhi7t7xbw9ebiezbcji?p=preview

html

<select    name="myselect"   id="myselect"   ng-model="formdata.model"   ng-change="onchange(formdata.model)"   ng-options="option.name option in options track option.id"></select>    selected child: {{formdata.model.child.name}}  <hr>  <div ng-repeat="option in options">   child name {{ option.name }}: <input ng-model="option.child.name"> </div> 

js

  $scope.onchange = function(option) {      angular.foreach($scope.options,function(optionitem){       if (optionitem.id == option.id){          $scope.formdata.model = optionitem;       }     })     }    $scope.options = [     {       id: 1,       name: "111",       child: {         id: 11,         name: "111-1"       }     },     {       id: 2,       name: "222",       child: {         id: 22,         name: "222-1"       }     }   ];    $scope.formdata = {     model: $scope.options[0]   };