39

给定一个使用 条件禁用的文本输入字段ng-disabled="truthy_scope_variable"，AngularJS 在第一次伪造范围变量时禁用该字段，但不会在后续更改时启用它。因此，该字段保持禁用状态。我只能假设出了点问题，但控制台日志是空的。

真实范围变量与单选按钮模型相关联，我什至$watch可以更改它，但输入字段ng-disabled没有按预期工作。我已经手动尝试调用$apply，但看起来 Angular 正在触发 DOM 更改。

在控制器中：

$scope.new_account = true

单选按钮：

<input type="radio" ng-model="new_account" name="register"
 id="radio_new_account" value="true" />

<input type="radio" ng-model="new_account" name="register"
 id="radio_existing_account" value="false" />

有条件禁用的输入字段：

<input type="password" ng-disabled="new_account" id="login-password"
 name="password" ng-model="password" />

如果我最初设置$scope.new_account = false，该字段将被禁用，但永远不会重新启用。为什么会这样？

4

3 回答 3

32

那是因为 HTML 属性始终是字符串，因此在您的示例中，ngDisabled 正在评估两种情况下的字符串（“true”或“false”）。

为了补救，您应该将模型与 ngDisabled 中的字符串值进行比较：

ng-disabled="new_account == 'false'"

...或使用复选框来获取实际的布尔值：

<input type="checkbox" ng-model="existing_account" name="register" id="checkbox_new_account" />
<label for="checkbox_new_account">Is Existing Account</label>

Password:
<input type="password" ng-disabled="existing_account" name="password" ng-model="password" />

这是具有两种解决方案的PLNKR 。

于 2013-07-25T10:40:09.727 回答
16

有一个替代解决方案可用，只需使用

ng值

 <input type="radio" ng-model="new_account" name="register"
 id="radio_new_account" ng-value="true" />

<input type="radio" ng-model="new_account" name="register"
 id="radio_existing_account" ng-value="false" />
      <input type="password" ng-disabled="new_account" id="login-password"
 name="password" ng-model="password" />
于 2013-07-25T10:43:20.897 回答
1

自 2016 年 3 月起，绑定值将更新 Chrome 和 Firefox 中的 ui，即使 ng-disabled 为 true 但在 Safari 中没有。在 Safari 中，当您使用 ng-disabled 时，ui 不会更新，尽管输入元素value属性将具有更新的值（element.value更改后检查。）

在 Safari 中，要强制使用ng-modelorng-value指令更新 ui，您必须使用 ng-readonly 而不是 ng-disabled。

于 2016-03-07T15:21:26.147 回答