角度，在文本框中显示选定的选项

Question

I have a multiple columns table and showing their values in multiple controls by Angular JS. For example I am using Select/Option (multiple) to show column A, and I want to use another text box to show column B, based on select/option. Here is code:

Column A in Select (multiple):

<select multiple data-ng-model="selectedEmp" data-ng-options="o.emp for o in post.Emps" >
    <option value="SampleValue">Samplevalue</option>
</select>

Column B in text box:

<input data-ng-model="selectedEmp.gender" type="text"  style="width:60px;"> </input>

The thing is, when I am not using 'Multiple' in select control, the gender value (in same record) can be displayed in text box, but when using 'multiple', the text box is not showing selected current record.

Please help on how to implement this.

Thanks

Answer 1

When you are using select without using multiple , you are binding to a object. So your selectedEmp might be something like {"emp":1,"gender":"M"} (an object).

But when you use multiple select, you are binding to an array. So your selectedEmp might be something like : [{"emp":1,"gender":"M"},{"emp":2,"gender":"F"}] . Notice the [] .

So, in case of multiple , you also need to pass the index whose value you want to bind. But in this case, it seems like you want to have input 's for multiple selected items from above select .

I would use something like this:

<input data-ng-model="s.gender" type="text" ng-repeat="s in selectedEmp" />