Angular 4 FormGroup value match array item

Question

I want to create a custom validation function for my form group which validates the input of the country matches to my country list item.

This is my country list:

this.sharedService.getCountry().subscribe(res => {
  res.map(item => {
    this.countryList.push(item);
  });
});

my form is:

this.form = fb.group({
    country: new FormControl('', [Validators.required]),
});

Sajeetharan · Accepted Answer · 2018-04-20 02:03:54Z

1

You need to write a custom validator service which checks for the input as follows,

function check_if_valid(value,array){
   if((alue){ 
       const isInArray = array.includes(value);
       return true;
   } else {
       return false;
   }
}

@Injectable()
export class ValidatorsService {

   public isInteger = (control:FormControl) => {
        return check_if_valid(control.value,yourarray);
   }

}

and in component

constructor(private _ValidatorsService: ValidatorsService){
    }

country: new FormControl('', [Validators.required,this._ValidatorsService.isInteger ]),

answered Apr 20, 2018 at 2:03

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Jim Over a year ago

so how do I call my array?

Jim Over a year ago

can I call it in constructor() ?

Sajeetharan Over a year ago

you can make the api call in service itself unless you are not using in your component

Jim Over a year ago

I get the error when I write this._ValidatorsService.isInteger in formControl

Jim Over a year ago

TS2345:Argument of type '(((control: AbstractControl) => ValidationErrors) | ((control: FormControl) => boolean))[]' is not assignable to parameter of type 'ValidatorFn | ValidatorFn[] | AbstractControlOptions'. Type '(((control: AbstractControl) => ValidationErrors) | ((control: FormControl) => boolean))[]' has no properties in common with type 'AbstractControlOptions'.

Collectives™ on Stack Overflow

Angular 4 FormGroup value match array item

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related