Mark
Mark

Reputation: 2587

Angular.js setting ng-options with in ng-repeat

I'm trying to set the correct select option based on a value in the ng-repeat.

See example here: https://jsfiddle.net/vok080z4/5/

Crazy, if you view the example, why is dave set to apples, but no one else is?

<body ng-app="eApp">
  <div ng-controller="splitsController" ng-cloak>

    <table class="widefat fixed" cellspacing="0">
      <thead class="thead">
        <tr>
          <th>Name</th>
          <th>Fruit</th>
       </tr>
      </thead>
      <tbody class="tbody">
        <tr ng-repeat="order in data.orders" ng-class-odd="'alternate'">
          <td>{{order.name}}</td>
          <td>
            <select ng-model="fruitSelect">
              <option value="">-- Select One --</option>
              <option ng-repeat="fruit in data.fruits track by fruit.id" value="{{fruit.id}}" ng-selected="fruit.id === order.fruitId">
                {{fruit.name}}
              </option>
            </select>
          </td>
         <td>
       </tr>
     </tbody>
   </table>
 </div>
</body>

Upvotes: 0

Views: 742

Answers (1)

Satpal
Satpal

Reputation: 133403

You should use ngOptions to generate select options and more important use ngModel to persist the selected value.

<select ng-model="order.fruitId" ng-options="item.id as item.name for item in data.fruits">
      <option value="">-- Select One --</option>              
</select>

DEMO

Upvotes: 1

Related Questions