Question

我正在使用html在angularjs中编写代码。在这个minlength和maxlength验证不起作用。我的代码 HTML代码：

<input type="text" id="healthcomplaint" ng-model="userDetails.healthcomplaint" style="color:#4a5665;" class="form-control" name="healthcomplaint" ng-required="true" ng-minlength="3" ng-maxlength="120" ng-pattern="/^[a-zA-Z0-9\s\[\]\.,\_\/\-#']*$/" tabindex="8">
<span class="ng-hide error_txt" ng-show="submitted && info.healthcomplaint.$error.required">Please enter health complaint.</span>     
<span class="ng-hide error_txt" ng-show="info.healthcomplaint.$error.minlength">health complaint should have at least 3 characters.</span>
<span class="ng-hide error_txt" ng-show="info.healthcomplaint.$error.maxlength">health complaint should not exceed 120 characters.</span>

Answer 1

确保novalidate与<form>一起使用以禁用浏览器的本机验证。并使用此模式代替ng-pattern pattern="[0-9]{9}"

Answer 2

Working Demo

 <form name='myForm' novalidate>

    <input type="text" id="healthcomplaint" ng-model="userDetails.healthcomplaint" style="color:#4a5665;" class="form-control" name="healthcomplaint" ng-required="true" ng-minlength="3" ng-maxlength="120" ng-pattern="/^[a-zA-Z0-9\s\[\]\.,\_\/\-#']*$/" tabindex="8">
    <span class="ng-hide error_txt" ng-show="myForm.healthcomplaint.$dirty && myForm.healthcomplaint.$error.required">Please enter health complaint.</span>     
    <span class="ng-hide error_txt" ng-show="myForm.healthcomplaint.$error.minlength">health complaint should have at least 3 characters.</span>
    <span class="ng-hide error_txt" ng-show="myForm.healthcomplaint.$error.maxlength">health complaint should not exceed 120 characters.</span>

    <input type='submit'>
  </form>

<强>更新

我已从关注submitted &&中删除了span。如果您要使用submitted，请将submitted &&替换为myForm.submitted &&

<span class="ng-hide error_txt" ng-show="submitted && info.healthcomplaint.$error.required">Please enter health complaint.</span>

为什么minlength和maxlength验证不起作用？

2 个答案: