AngularJS Directives

AngularJS Filters and Elements

AngularJS Tutorials

ng model Directive in AngularJS

ng-model Directive



The ng-model directive binds the value of HTML controls (input, select, textarea) to application data. It is a two-way binding i.e, If the user changes the value inside the input field, the AngularJS property will also change its value.


The purposes of ng-model directives are:-


  1. Validate User Input i.e, this directive can provide type validation for application data.

  2. Application Status i.e, this directive can provide status for application data.

  3. CSS Classes i.e, this directive provides CSS classes for HTML elements.


The ng-model directive adds/removes the following classes:-


  • ng-empty
  • ng-not-empty
  • ng-touched
  • ng-untouched
  • ng-valid
  • ng-invalid
  • ng-dirty
  • ng-pending
  • ng-pristine




< element ng-model="name" >< /element >


Further Explanation:-


Value Description
name The name of the property you want to bind to the form field.

Code Explanation

All Tutorials related to AngularJS Tutorials

All Sections related to AngularJS