AngularJS表格在编辑模式下停止排序

我有一个带有CRUD操作和可排序标题的AngularJS表。当我将新行添加到表格中时，行在跳跃，表格在编辑模式下得到排序

我想在编辑模式下停止排序，只应在保存新行后进行排序。我在网上搜索修复此问题，但没有任何帮助

以下是HTML文件：

<thead>   
    <tr>
         <td><input type="text" ng-model="main.search.Data1" id="myInput" placeholder="search for Data1..."/></td>
         <td><input type="text" ng-model="main.search.Data2" id="myInput" placeholder="search for Data2..."/></td>
       </tr>

       <tr class="table_header" style="background-color: blue;">
          <th><a href="#" ng-click="orderByField='data1'; reverseSort = !reverseSort"> Data1 <span ng-show ="!reverseSort">^</span><span ng-show="reverseSort">v</span></th>
          <th><a href="#" ng-click="orderByField='data2'; reverseSort = !reverseSort"> Data2</th>
       </tr> 
</thead>

<tbody>
   <tr ng-repeat=" code in main.Table | orderBy: Predicate | orderByField:reverseSort | filter:main.search"></tr>

   <script type="text/ng-template" id="dispay">
     <td>{{code.data1}}</td>
     <td>{{code.data2}}</td> 
   </script>

   <script type="text/ng-template" id="edit">
     <td><input type="text" ng-model="code.data1" class"form-control input-sm"/></td>
     <td><input type="text" ng-model="code.data2" class"form-control input-sm"/></td>
   </script>
</tbody>

---

该行为是正确的，因为在addNew上，您在apply cycle中添加了1条空记录，然后将重新对列表排序

你有两条路要走： 1） 添加新项目时，创建sperate对象，并在提交时将其添加到列表中：

 $scope.addNew = function(data) {
  $scope.newItem ={
    data1: "",
    data2: ""
  };
};

$scope.save = function() {
  $scope.table.push($scope.newItem);
}; 

这样的话，就有了更多的关注点，而不是把主要的清单混在一起

或者，如果您仍然希望直接将其添加到主列表中，我不建议您实现自定义过滤器，它始终将空数据保留在谓词方法的顶部

<tr class="table_header" style="background-color: blue;">
          <th><a href="#" ng-click="orderByField='data1'; reverseSort = !reverseSort" ng-disabled="setTrueFalse"> Data1 <span ng-show ="!reverseSort">^</span><span ng-show="reverseSort">v</span></th>
          <th><a href="#" ng-click="orderByField='data2'; reverseSort = !reverseSort" ng-disabled="setTrueFalse"> Data2</th>
       </tr> 

使用禁用的ng。。如果不希望对值进行排序，请将其设置为true，反之亦然

<tr class="table_header" style="background-color: blue;">
          <th><a href="#" ng-click="orderByField='data1'; reverseSort = !reverseSort" ng-disabled="setTrueFalse"> Data1 <span ng-show ="!reverseSort">^</span><span ng-show="reverseSort">v</span></th>
          <th><a href="#" ng-click="orderByField='data2'; reverseSort = !reverseSort" ng-disabled="setTrueFalse"> Data2</th>
       </tr> 

$scope.setTrueFalse = true/false