I am not getting how the ng-model are connected to the ng-repeat options. How can the code below be converted to an ng-repeat? I can get the ng-repeat work but
ng-selected="{{alternative.code == question.answer}}"
is what I don't understand how to do with the ng-options.
<select ng-model="question.answer">
<option ng-selected="{{alternative.code == question.answer}}"
ng-repeat="alternative in question.alternatives"
value="{{alternative.code}}">{{alternative.label}}</option>
</select>
Use the following:
<select ng-model="question.answer"
ng-options="alternative.code as alternative.label for alternative in question.alternatives">
</select>
if question.alternatives
is an array and the following:
<select ng-model="question.answer"
ng-options="alternative.code as alternative.label for (key, alternative) in question.alternatives">
</select>
if it is an object. Both expressions start with the syntax value as label
, which tells the <select>
what to consider a value (to be bound to model) and what to use as a label (visible for users). The whole business with "this option has that value and is selected when model has it too" is then done automatically. See documentation.