Angular 1.X中 ng-repeat配合拖拽排序插件引起的问题

2019年9月15日 142次阅读 来源: mumofa

如图 拖拽完 并不会正常排序。发现引起问题的原因是track by $index
但我的数据渲染需要嵌套ng-repeat

《Angular 1.X中 ng-repeat配合拖拽排序插件引起的问题》

但我的数据渲染用到嵌套ng-repeat,需要获取外部一层的$index

 
<tr ng-repeat="yAxis in tmpChartData.yAxis track by outIndex" ng-init="outIndex = $index">
    <th>{{outIndex+2}}</th>
    <th row-index="{{outIndex+1}}" tabindex="-1" editType="string">
        <input type="text" ng-model="selectedElement.module.yAxis[outIndex]">
    </th>
    <th class="editTh" ng-repeat="xAxis in tmpChartData.xAxis" edit-chart-th row-index="{{outIndex+1}}" tabindex="-1">
        <input type="number" ng-model="selectedElement.module.data[outIndex][$index]">
    </th>
</tr>

解决方法 ng-repeat 还有一种 (key,val) in Arr 的写法 所以只要改写成

<tr ng-repeat="(outKey,outVal) in tmpChartData.yAxis" ng-init="outIndex = $index">
    <th>{{outKey+2}}</th>
    <th row-index="{{outKey+1}}" tabindex="-1" editType="string">
        <input type="text" ng-model="selectedElement.module.yAxis[$index]">
    </th>
    <th class="editTh" ng-repeat="xAxis in tmpChartData.xAxis" edit-chart-th row-index="{{outIndex+1}}" tabindex="-1">
        <input type="number" ng-model="selectedElement.module.data[outKey][$index]">
    </th>
</tr>
    原文作者：mumofa
    原文地址: https://segmentfault.com/a/1190000008594814
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞