AngularJS条件ng-disabled不能重新启用

给定一个使用ng-disabled="truthy_scope_variable"的有条件禁用的文本input字段,AngularJS在范围variables第一次被伪造禁用该字段,但是在随后的变化中不启用它。 因此,该领域仍然残疾。 我只能假设出了问题,但是控制台日志是空的。

truthy范围variables绑定到一个单选button模型,我甚$watch可以$watch它的变化,但input字段的ng-disabled没有按预期工作。 我已经手动尝试调用$apply ,但它看起来像Angular触发DOM更改。

在控制器中:

 $scope.new_account = true 

单选button:

 <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字段:

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

如果我最初设置$scope.new_account = false ,该字段呈现禁用,但从来没有重新启用。 为什么发生这种情况?

有一个可供select的解决scheme可供使用

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" /> 

这是因为HTML属性总是string,所以在你的例子中,ngDisabled在两种情况下都计算string(“true”或“false”)。

为了补救,您应该将模型与ngDisabled中的string值进行比较:

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

…或使用checkbox来获取实际的布尔值:

 <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" /> 

这是一个两种解决scheme的PLNKR 。

截至2016年3月,绑定的值将更新Chrome和Firefox中的UI,即使在禁用ng的情况下为true,但在Safari中也不会。 在Safari中,当使用ng-disabled时,ui不会更新,虽然input元素value属性将具有更新的值(更改后检查element.value )。

在Safari中强制使用ng-modelng-value指令进行ui更新,您必须使用ng-readonly而不是ng-disabled。