AngularJS如何在列表中使用btn-group或radio group

Question

我有一个 ng-repeat 列表，我想在每一行中使用 btn-group 或 radio 组，如下所示：

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>

<tr ng-repeat="v_review_record in v_review_records_list track by $index">
                        <td>{{ $index + 1 }}</td>
                        <td><span>{{v_review_record.Name}}</span></td>
                        <td align="center">
                            <div class="btn-group">
                                <label class="btn btn-primary" type="radio" ng-model="v_review_record.Range_Access"  btn-radio="1" ng-checked="true">Agree</label>
                                <label class="btn btn-primary" type="radio" ng-model="v_review_record.Range_Access"  btn-radio="2">disagree</label>
                                <label class="btn btn-primary" type="radio" ng-model="v_review_record.Range_Access"  btn-radio="3">abstain</label>
                            </div>
                        </td>

                    </tr>

如何绑定每一行的值？或者为每一行设置一个默认值，v_review_record.Range_Access 值应该是 1,2,3。 而且，当我提交时，我想获取每一行的广播记录，我怎样才能得到呢？ 谢谢~

Answer 1

您似乎正在尝试将标签用作输入组件。只需将其中一些属性移动到没有标签的输入元素就可以了。我还将“btn-radio”属性替换为“ng-value”，因为我不确定btn-radio 在做什么，而ng-value 允许value 将其视为字符串的数值。

<label class="btn btn-primary">
    <input type="radio" ng-model="v_review_record.Range_Access" ng-value="1">
    Agree
</label>
<label class="btn btn-primary">
    <input type="radio" ng-model="v_review_record.Range_Access" ng-value="2">
    Disagree
</label>
<label class="btn btn-primary">
    <input type="radio" ng-model="v_review_record.Range_Access" ng-value="3">
    Abstain
</label>

这应该将选择绑定到数组中每个对象的Range_Access。

如果你想默认，那么我建议在控制器或服务中执行它，但如果你想将它保留在模板中，而不是将 ng-init 添加到包含元素中：

<div ng-init="v_review_record.Range_Access = 1" class="btn-group">