I developed a login component using the Angular-8 reactive form concept. I have asynchronous validations like empty fields, invalid emails. these validations should be asynchronous. But I have two custom validators like is-user-exist, is-password-match-user. These two validators should be only validated if user clicks submit. How to have a reactive form validator to check these two validators alone on submitting and other validations asynchronously.
-
1Does this answer your question? Angular 2 Reactive Forms trigger validation on submitPlochie– Plochie2019-12-26 16:44:16 +00:00Commented Dec 26, 2019 at 16:44
-
Thanks, but the below answer helped me.Sivaramakrishnan– Sivaramakrishnan2019-12-27 01:56:21 +00:00Commented Dec 27, 2019 at 1:56
Add a comment
|
1 Answer
You can control for a form (or single form elements) when the value or the validity is updated. This feature has been available in AngularJS 1.x but missed in Angular 2+ from some time. Starting from some version (Angular 5 I think) can be one of:
- change: change is the default mode. By using this update option the form / form control is updated after every single change.
- blur: the blur change mode is only updated the from values / validity status after a form control lost the focus.
- submit: updates are only done after form submit.
In reactive forms this can be done with the setting updateOn of either form or form control. Sample code:
this.nameForm = new FormGroup ({
firstname: new FormControl('', {
validators: Validators.required,
updateOn: 'change'
}),
lastname: new FormControl('', {
validators: Validators.required,
updateOn: 'submit' // <--
})
});