Ariff Haikal
Ariff Haikal

Reputation: 21

Input form that only accepts specific number of length in Angular

So I have an array of number [12,14,20]. I want this number to be the specific length inside my input form. so for example the user can only input number with the length of 12,14 and 20 else it will prompt an error. so far i only found minlength and maxlength method but it does not solve my problem. Can anyone help?

Upvotes: 1

Views: 445

Answers (1)

If you use Reactive form. I suggest you can write a custom validator

export function MaxLengthValidator(arr: number[]): ValidatorFn {
    return (control: AbstractControl): { [key: string]: any } => {
           return arr.some(el => el === control.value.toString().length) ? null : { 'LengthNotMatch' : { value: control.value } };
    };
}

You can check the simple demo here: https://stackblitz.com/edit/angular-custom-validator-wm8vjt?file=src%2Fapp%2Fapp.component.ts,src%2Fapp%2Fshared%2Fname.validator.ts,src%2Fapp%2Fapp.component.html,src%2Fapp%2Fapp.component.css

Upvotes: 2

Related Questions