Angularjs单选按钮

Posted

技术标签:

【中文标题】Angularjs单选按钮【英文标题】:Angularjs radio buttons 【发布时间】:2012-09-17 19:23:32 【问题描述】:

我知道在某些 Google 线程中已经谈到了这一点,但我仍然找不到将我的无线电输入绑定到模型的正确解决方案(以简洁的方式),

目前我有 html

<input ng-model="searchByRma" type="radio" name="search-type">
<input ng-model="searchByDelivery" type="radio" name="search-type">

在控制器中:

$scope.searchByRma      = true;
$scope.searchByDelivery = false;

这不起作用(与复选框一样)...

关于如何在不丢失数据绑定的情况下在第一个单选按钮上设置默认值的任何想法?

谢谢!

【问题讨论】:

【参考方案1】:

对我有用的是将模型变量设置为 ,这会将单选按钮重置为默认(未选中)状态。当然,这只有在你的单选按钮标签正确的情况下才有效,就像 tosh 的回答一样。

在你的情况下:

$scope.searchBy =  ;

【讨论】:

【参考方案2】:

我认为您应该在这些变量中使用具有不同值的相同变量 两个单选按钮。

<input ng-model="searchBy" value="Rma" type="radio" name="search-type">
<input ng-model="searchBy" value="Delivery" type="radio" name="search-type">

然后,您应该将 searchBy 设置为“Rma”或“Delivery”,具体取决于 用户输入。

【讨论】:

太棒了,我还在其中一个破坏它的单选按钮上设置了 ng-checked,所以它可能对某人有帮助......谢谢!!! 为什么例如这也能完美运行,但当 type='radio' 时却不行?

以上是关于Angularjs单选按钮的主要内容,如果未能解决你的问题,请参考以下文章

在选择最后一个按钮之前,AngularJS 单选按钮未标记为 $dirty

AngularJS - 未选中单选按钮

AngularJS、ngRepeat 和默认选中单选按钮

AngularJs - 在表格中设置单选按钮值

AngularJs:如何设置基于模型检查的单选按钮

Angularjs单选按钮