Tutorial by Examples

One of Angular's strength's is client-side form validation. Dealing with traditional form inputs and having to use interrogative jQuery-style processing can be time-consuming and finicky. Angular allows you to produce professional interactive forms relatively easily. The ng-model directive provide...

Angular Forms and Inputs have various states that are useful when validating content Input States StateDescription$touchedField has been touched$untouchedField has not been touched$pristineField has not been modified$dirtyField has been modified$validField content is valid$invalidField content is ...

Angular also provides some CSS classes for forms and inputs depending on their state ClassDescriptionng-touchedField has been touchedng-untouchedField has not been touchedng-pristineField has not been modifiedng-dirtyField has been modifiedng-validField is validng-invalidField is invalid You can u...

ngMessages is used to enhanced the style for displaying validation messages in the view. Traditional approach Before ngMessages, we normally display the validation messages using Angular pre-defined directives ng-class.This approach was litter and a repetitive task. Now, by using ngMessages we ca...

In some cases basic validation is not enough. Angular support custom validation adding validator functions to the $validators object on the ngModelController: angular.module('app', []) .directive('myValidator', function() { return { // element must have ng-model attribute // o...

Sometimes it is desirable to nest forms for the purpose of grouping controls and inputs logically on the page. However, HTML5 forms should not be nested. Angular supplies ng-form instead. <form name="myForm" noValidate> <!-- nested form can be referenced via 'myForm.myNestedFo...

Asynchronous validators allows you to validate form information against your backend (using $http). These kind of validators are needed when you need to access server stored information you can't have on your client for various reasons, such as the users table and other database information. To us...