AngularJS - 未选中单选按钮
Posted
技术标签:
【中文标题】AngularJS - 未选中单选按钮【英文标题】:AngularJS - Radio button not checked 【发布时间】:2017-06-21 02:17:51 【问题描述】:我有一个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/
【问题讨论】:
【参考方案1】:因为属性value
中的任何内容都获得toString()
类似值true
将被视为'true'
并且它将寻找'true'
(string) 而不是true
(boolean)。
最好使用ng-value
而不是value
属性。它会将true
值视为仅布尔类型的true
。
此外,在您的情况下,您必须添加 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>
Forked Fiddle
【讨论】:
@ChiefTwoPencils 我用 OP 的小提琴更新了答案。虽然感谢您的提醒:) 为什么例如这可以完美运行,但当 type='radio' 时却不行? 你能分享一个小提琴/plunkr吗? w3schools.com/code/tryit.asp?filename=GLX33M4EPJAC 什么问题,我试过了,但不知道你面临什么问题。你能详细说明一下吗? w3schools.com/code/tryit.asp?filename=GLX41P26BSR2以上是关于AngularJS - 未选中单选按钮的主要内容,如果未能解决你的问题,请参考以下文章
在选择最后一个按钮之前,AngularJS 单选按钮未标记为 $dirty