Angular Material: Reseting reactiveform shows validation error

Question

I am using angular5 reactivemodule to show a form in my application. I had also used required validator which will subsequently make the field in red color and show an error

Answer 1

I has the same issue to reset my formGroup and I take some of Alex Oleksiiuk solution, but I agree with H Dog because submitted only works on click. Finally, this was my solution:

1. Don't use ngSubmit directive, insted use declare a variable:

Template:

Controller: @ViewChild('formDirective') private formDirective: NgForm;

2. Set reset method

   resetForm() { this.formProduct.reset(); ...// }

3. Up to this point, the submit works and no longer show validation erros. But, if you press reset (cancel, remove, clear...) botton show again the error. To solve this, just put type="button" in your button tag.

  Save



  Clear