AngularJS-单选按钮未选中

Question

我ng-repeat里面有一堆单选按钮：

<div class="panel panel-default" ng-repeat="offer in vm.offerList">
    ...    
    <td ng-show="offer.edit">
        <div class="row">                        
            <input type="radio" name="before" ng-model="offer.before" value="false">
            <input type="radio" name="before" ng-model="offer.before" value="true">
       </div>
   </td>
   ...
</div>

该模型offer.before具有正确的值，但是，当显示该行时，单选按钮未显示为选中状态。为什么会这样呢？我需要单选按钮以显示选定的值。

这是我的问题的一个小提琴例子：http : //jsfiddle.net/danielrvt/dpoLdgjq/

Answer 1

因为属性内部的任何东西value都会toString()像value那样true被视为'true'＆，并且它将寻找'true'（string）而不是true（boolean）。

更好地使用ng-value而不是value属性。它将仅将true值视为trueboolean类型。

另外，在您的情况下，必须name为每个单选按钮组添加唯一的属性，每个offer元素单选将被视为唯一的表单元素。

标记

<div class="row">
    {{offer.before}}
    <input type="radio" name="before{{$index}}" ng-model="offer.before" ng-value="false">
    <input type="radio" name="before{{$index}}" ng-model="offer.before" ng-value="true">
</div>

分叉的小提琴