AngularJS Built-in directives ngModel


With ng-model you can bind a variable to any type of input field. You can display the variable using double curly braces, eg {{myAge}}.

<input type="text" ng-model="myName">

As you type in the input field or change it in any way you will see the value in the paragraph update instantly.

The ng-model variable, in this instance, will be available in your controller as $scope.myName. If you are using the controllerAs syntax:

<div ng-controller="myCtrl as mc">
    <input type="text" ng-model="mc.myName">

You will need to refer to the controller's scope by pre-pending the controller's alias defined in the ng-controller attribute to the ng-model variable. This way you won't need to inject $scope into your controller to reference your ng-model variable, the variable will be available as this.myName inside your controller's function.