Thursday, February 18, 2016

Angular Model

The ng-model directive binds the HTML control value to the application data. This is a two way binding if we change value in control it will automatically get changed in the app data and vice versa.

AngularJS will create property implicitly if it is missing in ng-model attribute.

In order to check status of the application data like valid, modified or touched, ng-model provides a power support.

Following classes are being added ore removed depending on status of the model.

  • ng-valid
  • ng-invalid
  • ng-pending
  • ng-pristine
  • ng-touched
  • ng-untouched
  • ng-dirty
<form ng-app="" name="testForm">
Email Address :<input type="email" name="emailAddress" ng-model="myText" required>
<p>Valid: {{testForm.emailAddress.$valid}} </p>
<p>Touched: {{testForm.emailAddress.$touched}} </p>
<p>Dirty: {{testForm.emailAddress.$dirty}} </p>
</form>

No comments:

Post a Comment