L'expression régulière n'agit pas comme prévu

Question

J'utilise une expression régulière pour valider certaines entrées de formulaire avec angularjs. J'utilise le ng-pattern pour cela.

<input type="text" ng-pattern="/^([A-z]){3}$/"> 
<button type="submit" ng-disabled="demoForm.$invalid">Ok</button> 

Si je tape quelque chose pas correspondant à l'expression est pas valide (comme prévu). Si je tape ce qui correspond au motif, il sera valide (comme prévu).

Mais cela ne fonctionne pas du tout comme prévu. Si je ne tape rien (entrée de texte vide) le formulaire est valide, et c'est ce que je veux éviter: Il ne devrait pas être valide.

Des suggestions?

Answer 1

Vous devez attribuer à l'entrée un attribut ng-model pour la validation de forme angulaire afin de le reconnaître. Vous pouvez également donner à l'entrée un attribut name pour plus de contrôle. Voir Angular Input documentation.

Cet exemple doit montrer comment ng-model et name peuvent être utilisés pour la validation de formulaire. Notez que j'ai également ajusté votre regex et fait l'entrée required.

var myApp = angular.module('myApp', []);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="myApp"> 
 
    
 
    <form name="demoForm"> 
 
    
 
    <input type="text" 
 
      ng-model="myValue" 
 
      name="myInput" 
 
      ng-pattern="/^[A-Za-z]{3}$/" 
 
      required /> 
 
    
 
    <button type="submit" ng-disabled="demoForm.$invalid">Ok</button> 
 
    
 
    <div>Input valid? {{demoForm.myInput.$valid}}</div> 
 
    <div>Form valid? {{demoForm.$valid}}</div> 
 
    <div>Model value: {{myValue}}</div> 
 
    </form> 
 
    
 
</div>