AngularJS - ng-repeatによって生成されたラジオボタンの選択時にモデルが更新されない

Question

ng-repeatを使用して複数のラジオボタンを生成していて、そのうちの1つが選択されたときにモデルを更新しようとしています。これは動作していないようです。

ng-repeatによって生成されるのとは対照的に、ラジオ入力がハードコードされている場合、同じマークアップがうまく動作します。

これは動作します：

<input type="radio" ng-model="lunch" value="chicken" name="lunch"> 
<input type="radio" ng-model="lunch" value="beef" name="lunch"> 
<input type="radio" ng-model="lunch" value="fish" name="lunch"> 
{{lunch}} 

これにはない：

<input type="radio" ng-model="lunch" ng-repeat="m in meat" value="m" name="lunch">  
{{lunch}} 

は両方ここに示すjsfiddleを参照してください：http://jsfiddle.net/mark_up/A2qCS/1/

任意の助けいただければ幸いです。

おかげ

Answer 1

<div ng-controller="DynamicCtrl"> 
    <input type="radio" ng-model="$parent.lunch" ng-repeat="m in meat" 
    ng-value="m" name="lunch">  
    {{lunch}} 
</div> 

は、トリックを行う必要があります。

私が理解しているように、ng-repeatは独自の$scopeを作成します。あなたは$parent $scope;を参照する必要があります。はい、AngularJSは扱いにくいです。またvalueをng-valueに変更する必要があります。

Answer 2

上記の問題は、NG-repeatが新しいスコープを作成するため、たまたま

hereを議論しました。基本的に、各<input>は、それ自身の内部スコープにselectedOption値を作成しています。その問題を回避するには、その値の新しいコンテナオブジェクトを作成します。たとえば、あなたがあなたのコントローラに宣言することができます：

$scope.data = {selectedOption: x}; 

をそしてあなたのテンプレートで、このようにng-model="data.selectedOption"

を使用して、NG-モデルが更新されます。.. :)

これはトリッキー

です

Answer 3

値をng値に置き換えるだけです