AngularJS - 模型不會更新由ng-repeat生成的單選按鈕選擇

我正在使用ng-repeat生成一堆單選按鈕，然後嘗試在選擇其中一個模型時更新模型。這似乎沒有工作。AngularJS - 模型不會更新由ng-repeat生成的單選按鈕選擇

當無線電輸入被硬編碼時，相同的標記工作得很好，而不是由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/

任何幫助，將不勝感激。

感謝

來源

2013-07-16 Mark Simpson

<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。

來源

2013-07-16 11:28:26 mpm

+33

使用'$ parent'的另一種方法是在控制器中使用一個對象屬性：'$ scope.selection = {lunch：'chicken'};'，然後在HTML中：' {{selection.lunch}} ' –

謝謝@MarkRajcok！它在幫助我的控制器中放置了'$ scope.selection = {lunch：'chicken'};''。我發現從html單選按鈕中刪除我的'ng-checked =「true」'，因爲控制器中的設置會自動/以編程方式選擇正確的單選按鈕。 –

@MarkRajcok，使用對象屬性避免使用$ parent的基本原理是什麼？ –

上述問題進行了討論here

這是因爲NG-重複創建一個新的範圍。基本上，每個<input>正在其內部範圍內創建一個selectedOption值。要解決該問題，請爲該值創建一個新的容器對象。例如，你可以聲明在你的控制器：

$scope.data = {selectedOption: x};

，然後在模板中，這樣一來，NG-模型進行了更新，使用ng-model="data.selectedOption"

.. :)

這是棘手

來源

2016-04-05 21:51:33

只需要用ng值替換值

來源

2017-07-20 09:05:36 Daniele

AngularJS - 模型不會更新由ng-repeat生成的單選按鈕選擇

回答

相關問題