텍스트 상자에서 angularjs의 유효성을 검사하는 방법은 무엇입니까?

Question

이름의 텍스트 상자에있는 ng-pattern이 특수 문자를 허용하는 이유는 무엇입니까? 혼자

<div ng-repeat="s in config.students"> 
    <div class="form-group"> 
     <label class="control-label col-lg-2"></label> 
     <div class="col-lg-5"> 
      <input type="text" class="form-control" name="students[]" ng-trim="false" ng-model="class.students[$index]" required ng-pattern="/^[a-zA-Z]*$/"> 
     </div> 
     <div class="col-md-5"> 
      <button class="btn btn-danger btn-sm" ng-click="removeStudent($index)" type="button">X</button> 
     </div> 
    </div> 
</div> 

<div class="form-group"> 
    <label class="control-label col-lg-2"></label> 
    <div class="col-lg-4"> 
     <button type="submit" class="btn btn-primary btn-grad btn-rect">Submit</button> 
     <a href ="<?php echo base_url();?>index.php/main/index" class="btn btn-default btn-grad btn-rect">Cancel</a> 
    </div> 
</div> 

Answer 1

ng-pattern이 텍스트 상자에 특정 텍스트를 입력에서 사용자를 방지 할 수 없습니다 : 이보기 파일입니다. 그렇게하고 싶다면 <input>에 맞춤 속성 명령을 사용해야합니다.

ng-pattern은 AngularJS 양식 유효성 검사와 함께 사용하기위한 것으로 유효성 검사 메시지를 숨기거나 표시하고 제출하기 전에 양식의 유효성을 검사하는 데 사용할 수 있습니다.

Answer 2

AngularJS 양식 유효성 검사에는 양식의 각 입력 필드마다 고유 한 이름이 필요합니다.

그러나 귀하의 경우 ng-repeat의 모든 입력 필드에 동일한 이름을 사용하고 있습니다. 그래서 $ 인덱스 여기

<input type="text" class="form-control" name="students{{$index}}" ng-trim="false" ng-model="class.students[$index]" required ng-pattern="/^[a-zA-Z]*$/"> 

Plunker 인을 사용하여 각 반복에서 입력에 대해 고유 한 이름을 추가하여 입력을 변경합니다.