Angular - 使用单选按钮答案

【问题标题】：Angular - using radio buttonsAngular - 使用单选按钮
【发布时间】：2017-02-25 22:44:49
【问题描述】：

我相信我正确地关注了AngularJS official documentation for radio buttons。

所以，我创建了这段代码：

indexSelected={{indexSelected}}
<form name="form">
    <div class="form-group">
        <label ng-repeat="s in prices track by $index" style="width: 100%">
            <input type="radio" name ="option" ng-model="indexSelected" value="{{s.months}}"> {{s.price}} + vat
        </label>
    </div>
</form>

另外，我用 ng-value 做了其他尝试，像这样......

indexSelected={{indexSelected}}
<form name="form">
    <div class="form-group">
        <label ng-repeat="s in prices track by $index" style="width: 100%">
            <input type="radio" name ="option" ng-model="indexSelected" ng-value="s.months"> {{s.price}} + vat
        </label>
    </div>
</form>

这是我的控制器

angular
.module('app')
.controller('ModalInstanceUpgradeSolutionCtrl', function ($scope,$rootScope, $uibModalInstance, appId) {
    $scope.prices = [{
        months: 1, price : 20
        }, { months 2: price: 40}]
     });

问题是：可能出了什么问题？因为当我单击单选按钮时，这不会更新模型 indexSelected。有什么线索吗？

【问题讨论】：

您违反了在ng-model 中不使用对象的黄金法则，因此由于ng-repeat 会遇到子作用域问题

标签： javascript angularjs radio-button angularjs-forms

【解决方案1】：

好的，找到错误了。 @charlietfl 给了我一些提示。谷歌一下就够了。

如果我将 ng-model="indexSelected" 替换为 ng-model="$parent.indexSelected"，这将访问父范围。 ng-repeat 创建一个子作用域。

【讨论】：