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

【问题标题】：ng-required does not work with number input with min conditionng-required 不适用于具有最小条件的数字输入
【发布时间】：2017-09-30 10:01:23
【问题描述】：

我有一个复选框，基于其 ng-model 的值，我正在使用 ng-show 切换 div 的可见性。

此 div 包含 <input> 或 type="number"。我验证了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>

如果有人在未触摸复选框和输入字段的情况下继续操作，则表单将被提交。但是，如果我单击复选框，输入一个数字

在控制台上我收到错误，它无法专注于输入控件。 ng-required 无法处理 min 条件。不管ng-required，它正在被检查。

有什么办法可以让它工作吗？

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

【问题讨论】：

标签： javascript html angularjs ng-required

【解决方案1】：

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

【讨论】：

【解决方案2】：

我用ng-if 代替了ng-show，它成功了。

我在发布问题之前已经尝试过，但是没有用。后来我意识到我已经在另一个 html 文件上完成了更改。

【讨论】：

【解决方案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>

【讨论】：