Prevent Angular overriding the default form behaviour

In Angular 8/9 the default behaviour is to take control of all <form> elements within the view hierarchy. This can be see by looking at the selector for the form directive.

@Directive({
  selector: 'form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]',
  providers: [formDirectiveProvider],
  host: {'(submit)': 'onSubmit($event)', '(reset)': 'onReset()'},
  outputs: ['ngSubmit'],
  exportAs: 'ngForm'
})

When the Angular Form directive is controlling a <form> element it is not possible to do a generic form POST. For instance, if you want to redirect to a third party payment service, which requires you to POST to the server to setup a session, and then redirect the current browser session.

In order to achieve this it is possible to get the Angular Form directive to skip a form by adding the ngNoForm attribute, as can be seen in the fore mentioned selector.

<form method="POST" action="/handler" ngNoForm>
    <button type="submit">GO</button>
</form>

This isn’t well documented anywhere, but the source code provides plenty of help where formal docs are lacking.