Search code examples
angularangular2-templateangular2-forms

How to trigger Angular 2 form submit from component?


Basically, I have

<form #f="ngForm" (ngSubmit)="save(f.form)" #formElement>
    ...
    <button class="btn btn-primary" #saveButton>Save</button>
</form>

I want to be able to trigger submit() from the component. I've tried @viewChild('formElement') and renderer.invokeElementMethod to trigger click().


Solution

  • NgForm has property ngSubmit which is EventEmitter. So doing emit() on this property from the component will trigger a submit.

    Also you need to use your f variable instead of formElement because f is referencing to ngForm.

    @ViewChild('f') form: NgForm;
    
    form.ngSubmit.emit();