angular-datatables - 角度数据表 : sort non-textual data

Question

有没有办法为包含非文本数据的列创建自定义排序？

这是一个快照:

我想按图标符号排序。

附言这两个图标都使用 ng-if 和数据集中的 bool 值显示。

编辑:我正在使用 Angular 方式显示数据。

<table datatable="ng" dt-options="dtOptionsLoginHistory" dt-column-defs="dtColumnDefsLoginHistory"
               class="table table-striped row-border hover"
               width="100%">
            <thead>
            <tr>
                <th>Success</th>
            </tr>
            </thead>
            <tbody>
            <tr ng-repeat="entry in entries">
                <td style="width: 10%;">
                    <i ng-if="!entry.failed" class="fa fa-check" style="color: green;"></i>
                    <i ng-if="entry.failed" class="fa fa-times" style="color: red;"></i>
                </td>
            </tr>
            </tbody>
        </table>

Answer 1

有几种不同的方法可以实现您想要的。考虑到您的设置，我相信最简单的方法是创建一个特殊的 orderType返回一个基于 fa-* 的值类 <i>元素呈现为:

$.fn.dataTable.ext.order['fa-classes'] = function(settings, col)  {
  return this.api().column( col, {order:'index'} ).nodes().map(function(td, i) {
    return $('i', td).hasClass('fa-check') ? '1' : '0';
  })
} 

会给出全部<i class="fa fa-check">订单1 , 任何其他 0 .这也可能是 switch { .. }返回多个不同的订单值。像这样使用它:

$scope.dtColumnDefsLoginHistory = [
   DTColumnDefBuilder.newColumnDef(0).withOption('orderDataType', 'fa-classes')
];  

小演示-> http://plnkr.co/edit/8S5f2MR331CiNBYYfDQf?p=preview