Angular 7 Form Validation and Display error message

问题

Please look my simple form in Stackblitz

https://stackblitz.com/edit/angular-et9uww

My form contains 2 checkboxes if I select one of the checkboxes it will populate one textbox. In my scenario, I have 2 checkboxes and 2 text boxes and one submit button.

NOTE- in my case i have n number of checkbox and child questions

Validation includes -> 2 textbox are mandatory

If the user submits the form without entering textbox it will show the error message.

STEP to Recreate

1. check the checkbox1, textbox will appear without any error message

screen shot

2.then submit the form it will show the error. that is fine.

screen shot

3. check the checkbox2, again new textbox will appear with error message without clicking submit button.

screen shot

screen shot

But I WANT that second error message display only if the user hit submit button again.

Thanks

回答1:

Not sure if I got your point, but try this:

add some variable submitCount: number to your component; then everytime you click the submit button, just increase this counter; and finally add to the ngIf of your 2nd textbox 'submitCount > 1 &&' and this should be it?

来源：https://stackoverflow.com/questions/57315314/angular-7-form-validation-and-display-error-message