Angular Forms and Inputs have various states that are useful when validating content
|Field has been touched|
|Field has not been touched|
|Field has not been modified|
|Field has been modified|
|Field content is valid|
|Field content is invalid|
All of the above states are boolean properties and can be either true or false.
With these, it is very easy to display messages to a user.
<form name="myForm" novalidate> <input name="myName" ng-model="myName" required> <span ng-show="myForm.myName.$touched && myForm.myName.$invalid">This name is invalid</span> </form>
Here, we are using the
ng-show directive to display a message to a user if they've modified a form but it's invalid.