I have a custom async validator, and I want to set updateOn: 'blur' property using FormBuilder:
myForm = this.formBuilder.group({
email: ['', [Validators.required], [this.myAsyncValidator]]
// ...
});
I tried this but it does not work:
email: ['', [Validators.required], [this.myAsyncValidator, {updateOn: 'blur'}]]
Note
I DO NOT want to create form control instances manually like the following:
myForm = new FormGroup({
email: new FormControl('', {asyncValidators: [this.myAsyncValidator]}, updateOn: 'blur')
});
there are two ways to achieve that -
myForm = this.formBuilder.group({email: this.formBuilder.control('', {updateOn: 'blur', validators: [], asyncValidators: []})})
or,
myForm = this.formBuilder.group({email: ['', {updateOn: 'blur', validators:[], asyncValidators: []}]})
I want to add more answer for this question.
Here is the code at the library:
So, from your question, look like you are trying to set updateOn for email formControl and you are setting 3 arguments. This is not correctly.
Change
myForm = this.formBuilder.group({
email: ['', [Validators.required], [this.myAsyncValidator]]
// ...
});
to
myForm = this.formBuilder.group({
email: ['', {validators: Validators.required, asyncValidators: this.myAsyncValidator, updateOn: 'blur'}]
// ...
});