Question

当我更改下拉值时，下拉标题会丢失

下拉名称都是动态的，只能从JSON中获取。现在，它一次只显示一个下拉名称。

这是我的代码

   <table border="1">
      <tr>
         <th ng-repeat="(key, val) in collectioninfo[0]">
            <span ng-if="allDropDownsHere.indexOf(key)>=0">
               <select ng-change="getchange(selectItem)" ng-model="selectItem.selectItem" >
                 <option selected disabled>{{key}}</option>
                  <option ng-repeat="(k, v) in val[0]" value="{{k}}">{{k}}</option>
               </select>
            </span>
            <span ng-if="allDropDownsHere.indexOf(key)<0">
            {{ key }}
            </span>
         </th>
      </tr>
      <tr ng-repeat="row in collectioninfo">
         <td ng-repeat="(key2, val2) in row">
            <span ng-if="allDropDownsHere.indexOf(key2)>=0">
            <!-- {{ getFirstKeyOfDropDown(val2) }} -->
            {{val2[0][selectItem.selectItem] || getFirstKeyOfDropDown(val2)}}
            </span>
            <span ng-if="allDropDownsHere.indexOf(key2)<0">
            {{ val2 }}
            </span>
         </td>
      </tr>
   </table>

http://jsfiddle.net/h6atm89o/16/

Answer 1

您可以将每个下拉列表的selectedItem保存在特定字段中，基于key的当前ng-repeat。

<!-- save selectedItem in specific field -->
<select ng-change="getchange(selectItem)" ng-model="selectItem[key]" >

<!-- display value based on value kept in selectItem -->
val2[0][selectItem[key2]]

参考下面的jsfiddle。

如何在下拉更改期间保留表头？

1 个答案: