ng-required 不适用于具有最小条件的数字输入

Question

我有一个复选框，基于其 ng-model 的值，我正在使用 ng-show.

切换 div 的可见性

此 div 包含 type="number" 的 <input>。我对其进行了验证 min="10000".

如果输入的数字小于 10000，我不希望提交表单。但是，我希望只有在选中复选框时才会发生这种情况。所以，我正在使用 ng-required 检查复选框的值。

<input type="checkbox" ng-model="isOn"/>

<div ng-show="isOn">
    <input type="number" min="10000" ng-model="counter" ng-required="isOn"/>
</div>

如果有人在没有触及复选框和输入字段的情况下继续操作，表单就会被提交。但是，如果我单击复选框，输入一个小于 10000 的数字，然后再次取消选中它，则不会提交表单。

在控制台上，我收到无法聚焦于输入控件的错误。 ng-required 无法在 min 条件下工作。不管 ng-required.

都在检查

有什么方法可以让它正常工作吗？

PS：我不想在按键上使用文本输入+长度限制+限制字符代码的解决方案，这样只能输入数字。

Answer 1

当用户取消选中复选框时，您需要将数字输入字段的模型重置为初始状态。

Answer 2

我用 ng-if 而不是 ng-show 并且它起作用了。

发帖前试过，没用。后来我意识到我已经在另一个 html 文件上进行了更改。

Answer 3

我希望这能奏效

<form name="MyForm" novalidate >
<input type="checkbox" ng-model="MyForm.isOn" required/>
 <div ng-show="MyForm.isOn.$touched||MyForm.$submitted">
 <span class="errormsg" ng-message="required" ng-show="MyForm.counter.$error.required">Please select the checkbox</span>                                                        
 </div>                 
<div ng-show="MyForm.isOn">
<input type="text"  ng-model="MyForm.counter" required min="1000" />
 <div ng-show="MyForm.counter.$touched||MyForm.$submitted">
 <span class="errormsg" ng-message="required" ng-show="MyForm.counter.$error.required">You can't leave this empty</span>                       
  <span class="errormsg" ng-message="required" ng-show="MyForm.counter.$error.min">Value should be atleast 1000</span>                        
  </div>
 </div>
 </form>

ng-required 不适用于具有最小条件的数字输入

ng-required does not work with number input with min condition

html

javascript

angularjs

ng-required