Question

我有以下为分类和搜索而创建的代码。

当我添加aaSorting时，我能够通过指定的列对初始表进行排序。但是，在搜索时，表格会完全消失，从DOM中删除。

如果没有默认的aaSorting链接到dtOptionsBuilder，我可以搜索但没有默认的排序顺序集。

我该如何解决这个问题？

角色代码

$scope.searchOrderHistoryData = function(){
  if ($scope.searchQuery.trim() == "")
  {
      $scope.cancel=false;
      return;
  }
  else{
    $scope.IssearchQuery = true;
  }
    $scope.filterOrderHistoryData = $scope.orderHistory.filter(function(r) {

     res = "";
     found = true;
    for (key in r)
     {
       if ((key == "OrderId" || key == "OrderName" || key == "TotalCost" || key == "SubmittedDate" || key == "SubmittedBy" || key== "Status") && r[key] != null)
         res += angular.lowercase(r[key].toString()) + " ";
     }
      if (res.indexOf(angular.lowercase($scope.searchQuery)) >= 0)
        return true;
    return false;
    });

}

       var orderHistoryCols = {'OrderId':0, 'TotalCost':1, 'SubmittedDate':2, 'SubmittedBy':3, 'Status':4};

    $scope.dtOptions = DTOptionsBuilder.newOptions()
    .withOption('responsive', true)
    .withOption('fnDrawCallback', function () {
      $('.dataTables_scrollBody').on("scroll", function(){  //activate when #center scrolls
       var left = $('.dataTables_scrollBody').scrollLeft();  //save #center position to var left
       $('.dataTables_scrollHead').scrollLeft(left);        //set #top to var left
      });
    })
    .withOption('bAutoWidth', false)
    //.withOption('sorting', false)
    .withOption('scrollY', '450px')
    .withOption('aaSorting', [[orderHistoryCols.SubmittedDate, 'desc']]);

模板（HTML）

<table datatable="ng" class="table" dt-options="dtOptions" dt-column-defs="dtColumnDefs">
              <thead style="background-color: #d8d8d8;">
               <tr>
                   <!--th ng-hide="true"></th-->
                   <th>Order #</th>
                   <th>Total Cost</th>
                   <th>Submitted</th>
                   <th>By</th>
                   <!-- <th>Delivered</th> -->
                   <th>Status</th>
                   <th data-orderable="false"></th>
                   <th data-orderable="false"></th>
               </tr>
              </thead>
           <tbody>
                  <tr style="font-weight: 100;cursor: pointer;" ng-repeat="data in filterOrderHistoryData">

Table data...
</tr> 
           </tbody>
       </table>

Answer 1

最后一行需要按如下方式编写为单维（size = 1）数组，以便只按一列正确排序。

.withOption('aaSorting', [orderHistoryCols.SubmittedDate, 'desc']);

原始问题中的数组数组有双括号（打开和关闭）。

.withOption('aaSorting', [[orderHistoryCols.SubmittedDate, 'desc']]);

AngularJS - 默认排序顺序不在搜索上呈现表

1 个答案: