如何根據下拉選擇重新創建表格

Question

我正在使用Angular JS動態顯示錶格。 這是很好的工作

最初當頁面加載時，第四列（域）正在顯示，基於銀行值。

如果我們將下拉菜單更改爲財務，如何顯示第四列下的財務值？

我們是否需要重新創建表格？

我的代碼

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
<div ng-app="myapp" ng-controller="FirstCtrl"> 
    <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" ng-init="selectItem = key"> 
        <option>{{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) }} 
      </span> 
      <span ng-if="allDropDownsHere.indexOf(key2)<0"> 
      {{ val2 }} 
      </span> 
     </td> 
     </tr> 
    </table> 
</div> 

http://jsfiddle.net/h6atm89o/7/

Answer 1

因爲ng-repeat會創建自己的範圍內，你的價值的dropdownlistselectItem無法將其當前屬於ng-repeat塊外部夠到。

解決方案是，您必須將應該在您的控制器中定義的變量綁定到dropdownlist，以便其值可以在tr的ng-repeat中達到。那麼你已經在列標題

val2[0][selectItem.selectItem] 

選擇，你可以根據顯示的數據是指例如jsfiddle。