Why is Angular form reloading the page?

Question

I have the following forms, on the same page:

<form ng-submit="actionA()">
    <input type="text">
    <input type="submit" value="Submit">
</form>

<form ng-submit="actionB()">
    <input type="text">
    <input type="submit" value="Submit">
</form>

At the moment, when I submit either form, the page reloads. How do I prevent that? I know I could use event.preventDefault() but I'd like to know if there's a plain Angular solution.

Answer 1

Make sure you import FormsModule from @angular/forms in the module containing your component because without it your form on submit will keep refreshing the page and failing silently without logging anything to the console.