在日期角的DataTable排序错误 [英] Angular-Datatables wrong sorting on date

问题描述

我使用的是角的DataTable的插件在我的项目，这对所有类型的，做工精细，除了日期。

例DESC：

• 2016年1月1日


• 2015年1月8日


• 2015年1月8日


• 2015年1月9日

例如ASC：

• 31/12/2015


• 31/10/2015


• 22/10/2015

我用在我的NG-重复日期过滤器的角路。我怀疑，这与排序错误的日期格式。我想它根据当天进行排序。我该如何解决这个问题？

 ＆LT;表类=表的表悬停数据表=NG＆GT;
        ＆LT;＆THEAD GT;
            ＆所述; TR＆GT;
                ＆LT;第i个客户和LT; /第i
                ＆LT;第i个项目＆LT; /第i
                ＆LT;第i个ID＆LT; /第i
                ＆LT;第i INV。日期和LT; /第i
                ＆LT;第i开始日期和LT; /第i
                ＆LT;第i个结束日期＆LT; /第i
                ＆LT;第i DKK不含税＆LT; /第i
                ＆LT;第i CIG＆LT; /第i
                ＆LT;第i注意与LT; /第i
                ＆LT;第i个卡斯特。经理＆LT; /第i
                ＆LT;第i关于＆LT; /第i
                ＆LT;第i个到期日和LT; /第i
                ＆LT;第i定稿＆LT; /第i
                ＆LT;第i个付费和LT; /第i
            ＆LT; / TR＆GT;
        ＆LT; / THEAD＆GT;
        ＆LT;＆TBODY GT;
            ＆LT; TR NG重复=发票vm.latestInvoices.LatestInvoices＆GT;
                ＆所述; TD＆GT; {{invoice.CompanyName}}＆下; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.ProjectName}}＆下; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.InvoiceID}}＆下; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.InvoiceDate |日期：'DD / MM / YYYY}}＆LT; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.InvoiceStart |日期：'DD / MM / YYYY}}＆LT; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.InvoiceEnd |日期：'DD / MM / YYYY}}＆LT; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.DKKexVAT}}＆下; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.CustomerInvoiceGroup}}＆下; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.Attention}}＆下; / TD＆GT;
                ＆LT; TD＆GT;客户经理＆LT; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.Regarding}}＆下; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.DueDate |日期：'DD / MM / YYYY}}＆LT; / TD＆GT;
                ＆LT; TD＆GT否LT; / TD＆GT;
                ＆所述; TD＆GT; {{invoice.Paid}}＆下; / TD＆GT;
            ＆LT; / TR＆GT;
        ＆LT; / TBODY＆GT;
    ＆LT; /表＆gt;
 

解决方案

数据表一般不通过检测数据类型为每列一份好工作。然而，如果该类型检测满足的任何的，与例如冲突假定号码，列被变成缺省阿尔法排序。我坚信这是这里的情况 - 如果呈现的内容符合 DD / MM / YYYY 标准100％，那么数据表会自动排序的列日期。

幸运的是，我们可以强制日期通过列数据类型 / columnDefs 设置。例如使用 DTColumnDefBuilder ：

$ scope.dtColumnDefs = [
    DTColumnDefBuilder.newColumnDef（[3,4,5,11]）。withOption（类型，日期）
];


这力量列3,4,5和11为类型日期。包括 dtColumnDefs 中的标记：

＆LT;表类=表的表悬停数据表=NGDT-列DEFS =dtColumnDefs ＆GT;


示例 - 试评出来的 .withOption（'型'，'约会'），看到了差距 - > 的 http://plnkr.co/edit/de9bd1YBsWMieWXMRaSu?p=$p$pview

I'm using the angular-datatables plugin in my project, which works fine on all types, except for dates.

Example DESC:

• 01/01/2016
• 01/08/2015
• 01/08/2015
• 01/09/2015

Example ASC:

• 31/12/2015
• 31/10/2015
• 22/10/2015

I'm using the Angular Way with a date filter in my ng-repeat. I have a suspicion that it sorts with a wrong date format. I would like it to sort based on the day. How can I fix this?

<table class="table table-hover" datatable="ng">
        <thead>
            <tr>
                <th>Client</th>
                <th>Project</th>
                <th>ID</th>
                <th>Inv. Date</th>
                <th>Start Date</th>
                <th>End Date</th>
                <th>DKK ex VAT</th>
                <th>CIG</th>
                <th>Attention</th>
                <th>Cust. Manager</th>
                <th>Regarding</th>
                <th>Due Date</th>
                <th>Finalized</th>
                <th>Paid</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="invoice in vm.latestInvoices.LatestInvoices">
                <td>{{invoice.CompanyName}}</td>
                <td>{{invoice.ProjectName}}</td>
                <td>{{invoice.InvoiceID}}</td>
                <td>{{invoice.InvoiceDate | date: 'dd/MM/yyyy'}}</td>
                <td>{{invoice.InvoiceStart | date: 'dd/MM/yyyy'}}</td>
                <td>{{invoice.InvoiceEnd | date: 'dd/MM/yyyy'}}</td>
                <td>{{invoice.DKKexVAT}}</td>
                <td>{{invoice.CustomerInvoiceGroup}}</td>
                <td>{{invoice.Attention}}</td>
                <td>Customer Manager</td>
                <td>{{invoice.Regarding}}</td>
                <td>{{invoice.DueDate | date: 'dd/MM/yyyy'}}</td>
                <td>No</td>
                <td>{{invoice.Paid}}</td>
            </tr>
        </tbody>
    </table>

解决方案

dataTables generally does a good job by detecting datatypes for each column. However, if the type detection meets anything that conflicts with for example assumed numbers, the column is turned into default alpha sorting. I strongly believe this is the case here - if the rendered content meets the dd/MM/yyyy criteria 100%, then dataTables should automatically sort that column as date.

Luckily we can force the date datatype through the columns / columnDefs settings. Use for example DTColumnDefBuilder :

$scope.dtColumnDefs = [  
    DTColumnDefBuilder.newColumnDef([3,4,5,11]).withOption('type', 'date')
];

This forces column 3,4,5 and 11 to be of type date. Include dtColumnDefs in the markup :

<table class="table table-hover" datatable="ng" dt-column-defs="dtColumnDefs">

Example - try to comment out the .withOption('type', 'date') and see the difference -> http://plnkr.co/edit/de9bd1YBsWMieWXMRaSu?p=preview

这篇关于在日期角的DataTable排序错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！