为什么在输入文本输入时单选按钮不能保持选中状态答案

【问题标题】：Why can't a radio button stay selected when typing in text input为什么在输入文本输入时单选按钮不能保持选中状态
【发布时间】：2015-02-17 13:50:19
【问题描述】：

在一个项目中，我需要一个包含单选按钮并将最后一项作为输入字段的表单。我们正在使用 AngularJS。

将 vm.appModel.amount 绑定到输入字段和不同的单选按钮选择将起作用：单击提交按钮时使用的数据将有效。

但是，如果用户在文本输入中单击并开始输入，则单选按钮会丢失其选中值，即使在文本输入上进行了许多检查以保持选中值设置为 true。 (See code)

ng-focus="isManualInputSelected = true;"
ng-change="isManualInputSelected = true;"
ng-click="isManualInputSelected = true;"

在无线电输入上，这应该使其保持激活状态，但不会。 (See code)

ng-checked="isManualInputSelected"

查看回购：https://github.com/jansensan/test-angularjs-text-input-in-radio-group

任何有关如何确保在文本字段中键入时保持选中单选按钮的指导，我们将不胜感激。谢谢。

【问题讨论】：

标签： javascript html angularjs forms

【解决方案1】：

为您创建了解决问题的拉取请求。

https://github.com/jansensan/test-angularjs-text-input-in-radio-group/pull/1

正如 jw56578 所说，vm.appModel.amount 属性通过在输入中添加一个值被覆盖，这意味着不再检查单选按钮。

我已经重构了您的代码，使其包含具有属性金额和类型的支付对象。对于手动付款，payment.type 现在将被设置（这控制单选按钮），金额存储在 payment.amount 中。

【讨论】：

非常感谢@Daniël 和 jw56578 的澄清，最后一个单选按钮确实不需要绑定到属性。我采取了与 PR 不同的方式（payment.type 值在我的情况下是多余的），但它有很大帮助！我将很快调整我的 repo 以显示更新，以及我从那个 PR 中学到的东西。

【解决方案2】：

您已将 ng-model 绑定到 vm.appModel.amount 属性单选按钮的值为 0 只有当 vm.appModel.amount 属性的值为 0 时才会检查单选按钮您已将文本框绑定到相同的属性，因此当您开始输入时，您将值更改为 0 以外的值，这样单选按钮就会被取消选中似乎没有必要使用 ng-model 将单选按钮绑定到 amount 属性。删除它。

【讨论】：