Validate phone number using angular js

Question

Want to set phone-number to 10 digits, How can I do this using Angular js.

This is what I have tried:

Answer 1

<form name = "numberForm">
    <div>
    <input type="number"
           placeholder = "Enter your phonenumber"
           class = "formcontroll"
           name = "numbers"
           ng-minlength = "10"
           ng-maxlength = "10"
           ng-model="phno" required/>
           <p ng-show = "numberForm.numbers.$error.required ||
                       numberForm.numbers.$error.number">
                       Valid phone number is required</p>
            <p ng-show = "((numberForm.numbers.$error.minlength ||
                        numberForm.numbers.$error.maxlength)
                        && numberForm.numbers.$dirty)">
                        Phone number should be 10 digits</p><br><br>
       </div>
   </form>

Answer 2

Check this answer

Basically you can create a regex to fulfil your needs and then assign that pattern to your input field.

Or for a more direct approach:

<input type="number" require ng-pattern="<your regex here>">

More info @ angular docs here and here (built-in validators)

Answer 3

use ng-intl-tel-input to validate mobile numbers for all countries. you can set default country also. on npm: https://www.npmjs.com/package/ng-intl-tel-input

more details: https://techpituwa.wordpress.com/2017/03/29/angular-js-phone-number-validation-with-ng-intl-tel-input/