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

Question

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

<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

您似乎在尝试将标签用作输入组件。只需将其中一些属性移动到没有标签的输入元素就可以使事情正常进行。我还用“ng-value”替换了“btn-radio”属性，因为我不确定 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">

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

AngularJS how to use btn-group or radio group in list

list

radio

angularjs