angularjs - AngularJS - 模型未在选择由 ng-repeat 生成的单选按钮时更新

Question

我正在使用 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/

任何帮助，将不胜感激。

谢谢

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 创建了一个新范围。基本上，每个<input>都在自己的内部范围内创建一个 selectedOption 值。要解决此问题，请为该值创建一个新的容器对象。例如，您可以在控制器中声明：

$scope.data = {selectedOption: x};

然后在您的模板中，使用ng-model="data.selectedOption"

通过这种方式，ng-model 得到更新.. :)

这很棘手

Answer 3

只需要用 ng-value 替换 value