javascriptangularjsangularjs-ng-value

Angularjs: when use ng-value, value = 0?

I got one weird error. When I use ng-value, the page render a 'value=0' for some options. The console doesn't show errors.

Here is the code:

<option ng-repeat="x in makes" ng-value="{{x.make_id}}">{{x.make}}</option>

Here is the result:

<option ng-repeat="x in makes" ng-value="acura" class="ng-binding ng-scope">ACURA</option>
<!-- end ngRepeat: x in makes -->
<option ng-repeat="x in makes" ng-value="alfa-romeo" class="ng-binding ng-scope" value="0">ALFA ROMEO</option>
<!-- end ngRepeat: x in makes -->
<option ng-repeat="x in makes" ng-value="alpina" class="ng-binding ng-scope">ALPINA</option>
<!-- end ngRepeat: x in makes -->
<option ng-repeat="x in makes" ng-value="armstrong-siddeley" class="ng-binding ng-scope" value="0">ARMSTRONG SIDDELEY</option>
Solution

  • Don't bind an expression. ngValue uses $eval data binding which means you should remove the {{ }}

    <option ng-repeat="x in makes" ng-value="x.make_id">{{x.make}}</option>

    Edit: This isn't documented very well in the AngularJS docs.