0

The first one appear like below:

<option value="? number:0 ?"></option>

HTML:

<select name="questionId1" class="questionId1 form-control required" tabindex="3" ng-model="abCtrl.form.questionSel.q1.index" ng-change="abCtrl.changeFn()" >
    <option ng-repeat="question in abCtrl.form.questions" value="{{question.index}}"
            ng-selected="question.index == abCtrl.form.questionSel.q1.index">{{question.val}}
    </option>
</select>

JS:

this.form={
           questions:      [],
           questionSel:    {q1:{index:0,}, q2:{index:1}},
}

form.questions is filld in by an ajax call

Donovant
  • 3,091
  • 8
  • 40
  • 68

1 Answers1

0

That happens when the value bound to the ng-model variable doesn't match any option value:

ng-model="abCtrl.form.questionSel.q1.index"

Important:

Comparison with question.index is strict: types must also match.

When you use repeated options instead of ng-options, i.e. when you write value="{{question.index}}", the value of the option becomes a string. Therefore the value of the variable in ng-model, which is a number does not match, and you get an empty option.

With ng-options you would avoid this problem as you can bind other types than strings for the options:

<select name="..." ng-model="abCtrl.form.questionSel.q1.index" ng-options="question.index as question.val for question in abCtrl.form.questions">
</select>
Michel
  • 26,600
  • 6
  • 64
  • 69
  • No, it's not for this reason, even If I change to ".form.questions.index" it doesn't work. – Donovant Oct 26 '15 at 16:44
  • Types should also match. And according to the empty option generated, your `index` are numbers. – Michel Oct 26 '15 at 16:45
  • So what should I do? Sorry but I haven't caught it – Donovant Oct 26 '15 at 16:49
  • I used ng-options, but because I have two selects, with same options and both the select can't have the same selected option, I was suggested to use ng-repeat in the option tag – Donovant Oct 26 '15 at 16:55
  • Hm, looks like an advice in the wrong direction. At least I don't see why it would not be possible with `ng-options`. Do you have the link to the question, where you were told that? – Michel Oct 26 '15 at 17:09
  • Yes sure http://stackoverflow.com/questions/33345399/how-can-i-disable-options-for-different-selects-in-order-to-have-always-differen – Donovant Oct 26 '15 at 17:11
  • Should have used `... disable when (question.index === questionSel.q2) ` and vice-versa in `ng-options` : see [this fiddle](http://jsfiddle.net/L4xmdLc7/). Does it correspond to what you need? – Michel Oct 26 '15 at 17:15
  • Yes exactly, but you've got '' Anyway why it doesn't work with ngRepeat on options? I mean, it works as well, but if I change value it keeps the first disabled option on the second select. – Donovant Oct 26 '15 at 17:18
  • 1
    `` is because I've left unset variables binded in `ng-model`. See [updated fiddle](http://jsfiddle.net/L4xmdLc7/1/). The `index` property is a number that's why it doesn't work (doesn't match) with `ngRepeat` – Michel Oct 26 '15 at 17:24