Отправка формы в Angular

Для того, чтобы отправить форму необходимо нажать на соответствующую кнопку в форме. Однако в Angular можно привязать к кнопке событие ngSubmit, которое будет генерироваться при нажатии на кнопку.

Давайте вначале вызовем событие onSubmit в нашем классе AppComponent:

export class AppComponent {
	name: string = '';
	email: string = '';

	onSubmit(form: NgForm) {
		console.log(form);
	}
}

Затем в HTML-шаблоне прописываем в теге <form> функцию onSubmit:

<form #myForm="ngForm" novalidate (ngSubmit)="onSubmit(myForm)">
	<div class="form-group">
		<label>Name</label>
		<input class="form-control" name="name" [(ngModel)]="name" required />
	</div>
	<div class="form-group">
		<label>Email</label>
		<input class="form-control" name="email" ngModel
		required email />
	</div>
	<div class="form-group">
	<input type="submit" [disabled]="myForm.invalid" class="btn btn-default" value="Submit" />
	</div>
</form>

Таким образом, при нажатии кнопки в нашу консоль будет отправляться целый объект NgForm.