なぜminlengthとmaxlength検証が機能していないのですか？

Question

私はangularjsにhtmlを使ってコードを書いています。このMINLENGTHとMAXLENGTH検証に.here私のコード 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

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> 

のこのパターンを使用して更新

私はspanを次からsubmitted &&を削除しました。あなたがsubmittedを使用したい場合は、myForm.submitted &&

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

Answer 2

は、ブラウザのネイティブの検証を無効にする<form>でnovalidateを使用してください。 、代わりにng-patternpattern="[0-9]{9}"