Angular 4 Form Validators - minLength & maxLength does not work on field type number

Question

I am trying to develop a contact form, I want user to enter phone number values between length 10-12.

Notably same validation is working on Message

Answer 1

I have a trick that 100% work.

Define input of type 'text' and not 'number'.

For eg:

Then use pattern which is part of Validation.

Like :

this.ValidOtpForm = this.formbuilder.group({
             OtpUserInput: new FormControl(
              { value:'', disabled: false },
          [
          Validators.required,
          **Validators.minLength(6),
          Validators.pattern('[0-9]*')**
        ]),
});

It means we define input type text that is suitable for min length and we also define pattern(validation) for numeric value so that we can achieve both validation.

Remaining code :

Use 6 or more characters with a mix of letters
Please enter numeric value.