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会创建自己的范围，因此selectItem的{{1}}值无法在其当前所属的dropdownlist块之外到达。

解决方案是您必须将应在控制器中定义的变量绑定到ng-repeat，以便可以在dropdownlist的{{1}}中达到其值。然后，您可以根据您在列标题中选择的内容显示数据

ng-repeat

参考示例 jsfiddle 。

如何根据下拉选择重新创建表列

1 个答案: