奇妙な振る舞いの範囲とng-repeatの表示、角度JS

Question

私は奇妙な振る舞いをしています。

<div class="form-group"> 

    <select class="form-control" name="name" id="repeatSelect" ng-model="selectedOption"> 
    <option ng-repeat="o in availableOptions" value="{{o}}">{{o.name}}</option> 
     </select> 
    </div> 
<p>{{selectedOption}}</p> 
<p>{{selectedOption.value}}</p> 

コントローラに私が持っている：私は以下のコードを有する鑑み

$scope.availableOptions= [ 
    {id: '1', name: 'name2', value:{w: 100, h: 250}}, 
    {id: '2', name: 'name1', value:{w: 200, h: 100}}, 
    ]; 
$scope.selectedOption = $scope.availableOptions[1]; 

問題は以下である：最初の時点で最初の二つ<p>（selectedOptionとselectedOption.value）が正しく表示されています。しかし、私が選択した値を変更するときは、が表示され、<p>{{selectedOption.value}}</p>は何も表示されません。

ヘルプ？

PD：ng-optionを選択しても機能しましたが、なぜng-repeatでないのですか？

Answer 1

唯一の説明は、それが文字列にオブジェクトを変更するということでした。あなたの周りの作業は行うことができ、このような選択と機能が見て何かにng-change="foo(selectedOption)"を作成している：我々は値を文字列に変換されていることを確認することができ、ここから

$scope.foo = function(val){ 
    $scope.selectedOption = angular.fromJson(val); 
} 

EDIT

http://www.w3schools.com/tags/tag_option.asp。

Answer 2

は、値の属性を変更してみてください：私は考えることができ

<div class="form-group"> 

    <select class="form-control" name="name" id="repeatSelect" ng-model="selectedOption"> 
    <option ng-repeat="o in availableOptions" ng-value="o.value">{{o.name}}</option> 
     </select> 
    </div> 
<p>{{selectedOption}}</p> 
<p>{{selectedOption.value}}</p>