Valider le numéro de téléphone en utilisant js angulaire
Souhaitez définir téléphone-numéro de 10 chiffres, Comment puis-je faire cela à l'aide de Angular js.
C'est ce que j'ai essayé:
<form class="form-horizontal" role="form" method="post" name="registration" novalidate>
<div class="form-group" ng-class="{'has-error': registration.phone.$error.number}">
<label for="inputPhone" class="col-sm-3 control-label">Phone :</label>
<div class="col-sm-9">
<input type="number"
class="form-control"
ng-minlength="10"
ng-maxlength="10"
id="inputPhone"
name="phone"
placeholder="Phone"
ng-model="user.phone"
ng-required="true">
<span class="help-block"
ng-show="registration.phone.$error.required &&
registration.phone.$error.number">
Valid phone number is required
</span>
<span class="help-block"
ng-show="((registration.password.$error.minlength ||
registration.password.$error.maxlength) &&
registration.phone.$dirty) ">
phone number should be 10 digits
</span>
</div>
</div>
</form>
Mais je ne reçois pas l'erreur de validation.
source d'informationauteur Praveen M P
Vous devez vous connecter pour publier un commentaire.
Essayez ceci:
Cochez cette réponse
Fondamentalement, vous pouvez créer une expression régulière pour répondre à vos besoins et affectez-le modèle de votre champ de saisie.
Ou pour une approche plus directe:
Plus info @ angulaire docs ici et ici (intégré dans les validateurs)
Vous pouvez également utiliser
ng-pattern
et je sens que ça va être une bonne pratique. De même, essayez d'utiliserng-message
. S'il vous plaît regarder la ng-modèle attribut sur le code html suivant. L'extrait de code est partielle, mais j'espère que vous le comprenez.utilisation ng-intl-tel-entrée pour valider les numéros mobiles de tous les pays. vous pouvez définir des pays aussi.
sur npm: https://www.npmjs.com/package/ng-intl-tel-input
plus de détails: https://techpituwa.wordpress.com/2017/03/29/angular-js-phone-number-validation-with-ng-intl-tel-input/
Encore plus propre et plus professionnel que j'ai trouvé est d'utiliser AngularUI Masque. Très simple à mettre en œuvre et le masque peut être personnalisé pour les autres entrées. Alors qu'un simple requise de validation est tout ce dont vous avez besoin.
https://angular-ui.github.io/
Utilisation ng-modèle, dans cet exemple, vous pouvez valider une simple patern avec 10 numéros, lorsque le patern ne correspond pas ,le message est le spectacle et le bouton est désactivé.
Vous pouvez également utiliser un autre complexe patern comme
^+?\d{1,3}?[- .]?(?(?:\d{2,3}))?[- .]?\d\d\d[- .]?\d\d\d\d$
pour les plus complexes des numéros de téléphone
Ici "userForm" est mon nom de formulaire.