javascript - AngularJs doesn't update select in the html even if the model is pre-initialized -

javascript - AngularJs doesn't update select in the html even if the model is pre-initialized -

my html is:

<label> size scale: </label> <select ng-model="product.sizescale" name="sizescale" class="form-control" ng-options="value (key, value) in sizescalecode.sizestype" ></select>

<label> size: </label> <select ng-model="product.size" name="size" class="form-control" ng-options="value (key, value) in sizescalecode[product.sizescale]" ></select>

the $scope.sizescalecode that:

"sizescalecode":{ "sizes_type" : { "0" : "it", "1" : "fr" }, "it" : { "0" : "54", "1" : "57", "2" : "unica" }, "fr" : { "0" : "54", "1" : "57", "2" : "taille unique" }

}

the thought 1 time selected size scale automatically size updated right list of value. , code works during input phase. not working when 2 scope variables "product.sizescale" , "product.size" (both of them string) filled existing value , 2 selects consequence pre-filled value.

any idea?

this works me. bug found in html phone call variable "sizestype" , in javascript phone call "sizes_type". here working fiddle correction:

$scope.sizescalecode = { sizestype : { ...

http://jsfiddle.net/63ojssrc/

javascript html angularjs