Improve this Doc  View Source

ngValue

  1. - directive in module ng

Binds the given expression to the value of <option> or input[radio], so that when the element is selected, the ngModel of that element is set to the bound value.

ngValue is useful when dynamically generating lists of radio buttons using ngRepeat, as shown below.

Likewise, ngValue can be used to generate <option> elements for the select element. In that case however, only strings are supported for the valueattribute, so the resulting ngModel will always be a string. Support for select models with non-string values is available via ngOptions.

Directive Info

  • This directive executes at priority level 0.

Usage

  • as attribute: 
    <input
  [ng-value="string"]>
...
</input>

Arguments

Param Type Details
ngValue
(optional)
 string

angular expression, whose value will be bound to the value attribute of the input element

Example

<script>
   angular.module('valueExample', [])
     .controller('ExampleController', ['$scope', function($scope) {
       $scope.names = ['pizza', 'unicorns', 'robots'];
       $scope.my = { favorite: 'unicorns' };
     }]);
</script>
 <form ng-controller="ExampleController">
   <h2>Which is your favorite?</h2>
     <label ng-repeat="name in names" for="{{name}}">
       {{name}}
       <input type="radio"
              ng-model="my.favorite"
              ng-value="name"
              id="{{name}}"
              name="favorite">
     </label>
   <div>You chose {{my.favorite}}</div>
 </form>
Load online demo