具有两个值的angularjs ngmodel值

Question

I have this dropdown control

<div ng-repeat="prop in props" style="margin-bottom: 10px;">
  <label class="col-md-4 control-label">Property {{$index + 1}} ({{prop.Value}})</label>
  <div class="col-md-8">
    <select ng-model="gradingvalues[$index]" class="form-control">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
    </select>
  </div>

And in the js code the gradingvalues array is declared as:

$scope.gradingvalues = [];

What I want is, beside the actual value which is selected in the dropdown, I want to have the propertyID as well, something like:

ng-model="gradingvalues[$index, propertyID]"

Is that possible?

Answer 1

Change your $scope.gradingvalues = []; instead of an array use an object:

$scope.gradingvalues = {};

And update your ng-model

ng-model="gradingvalues[prop]"

This way you will have the " propertyID " as a key with the value selected on the select element.

Answer 2

Props and gradingvalues will be always in a 1:1 relation so you can use a property of "prop" to store the grading values:

<div ng-repeat="prop in props" style="margin-bottom: 10px;">
  <label class="col-md-4 control-label">Property {{$index + 1}}    ({{prop.Value}})</label>
  <div class="col-md-8">
    <select ng-model="prop.gradingvalue" class="form-control">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
    </select>
  </div>