Working with AngularJS forms

AngularJS offers close integration with HTML form elements in the form of directives to afford you the ability to build animated and styled form pages, complete with validation, quickly and easily.

How to do it…

AngularJS forms exist inside the <form> tag, which corresponds to a native AngularJS directive, as shown in the following code. The novalidate attribute instructs the browser to ignore its native form validation:

<form novalidate>
  <!-- form inputs -->
</form>

Your HTML input elements will reside inside the <form> tags. Each instance of the <form> tag creates a FormController, which keeps track of all its controls and nested forms. The entire AngularJS form infrastructure is built on top of this.

Tip

As browsers don't allow nested form tags, ng-form should be used to nest forms.

What the form offers you

Suppose you have a controller; a form in your application is as follows:

<div ng-controller="Ctrl">
  <form novalidate...