Angular 8 数据表日期排序问题 dd/mm/yyyy答案

【问题标题】：Angular 8 Datatable Date Sorting Issue dd/mm/yyyyAngular 8 数据表日期排序问题 dd/mm/yyyy
【发布时间】：2020-08-15 15:36:05
【问题描述】：

我无法在 Angular 数据表中按升序对日期进行排序。请帮助。我从 api 获得的日期格式是 yyyy-mm-dd，我使用渲染函数将其转换为 dd-mm-yyyy。

由于我只想在数据表中的 dd-mm-yyyy 中显示日期，因此我正在对其进行转换。

请查看图片以供参考（第一行和最后一行）

HTML 类

   <table datatable [dtOptions]="dtOptions" [dtTrigger]="dtTrigger"  class="row-border hover">
   </table>

在组件类中我使用了 dtoptions 来显示数据

this.dtOptions = {

  ajax: {
    url: environment.api_base_url + "abc",

    method: 'POST',
    data: {
      "abccreateddate": this.myDate,

    },
    dataSrc: function (json) {
      //alert(json);
      let return_array = [];
      return_array = json;
      return return_array;
    }

  },
  "order": [[2, "asc"]],
  'columnDefs': [ { 'type': 'date', 'targets': 2 } ],
  columns: [

    {
      title: 'ReportName',
      data: 'reportname',

    },
    {
      title: 'Report Start Date',
      data: 'reportstartdate',
      "render": function (data) {
        var date = new Date(data);
        var month = date.getMonth() + 1;
        return  ("0" + date.getDate()).slice(-2) +"-"+ (month.toString().length > 1 ? month : "0" + month) + "-" + date.getFullYear();
    }
    },
    {
      title: 'Report Due Date',
      data: 'reportduedate',
      "render": function (data) {
        var date = new Date(data);
        var month = date.getMonth() + 1;
        return  ("0" + date.getDate()).slice(-2) +"-"+ (month.toString().length > 1 ? month : "0" + month) + "-" + date.getFullYear();
    }
  }

]

我的 API 回复：

[{"reportname":"TestReport1","reportstartdate":"2020-04-30","reportduedate":"2020-04-30"}, {"reportname":"Monthlynew","reportstartdate":"2020-03-28","reportduedate":"2020-04-04"} ]

please check pic for reference

【问题讨论】：

那里没有对任何内容进行排序的代码，并且没有看到您要排序的数据，答案是菠萝 - 哦，等待是 "order": [[2, "asc"]], 应该按第 2 列排序，这被描述为类型“日期”？
嗨 Jaromanda，我已经添加了 json 响应
属性名称reportstartdate 和reportduedate 与columns:[] 有什么关系？这些列似乎是reportname、creationdate 和lastdate - 但数据有reportname、reportstartdate 和reportduedate
是的，对不起，我已经编辑过了
对，现在看起来更可信了......如果你删除 columnDefs 属性会发生什么 - 这会很有趣，因为 yyyy-mm-dd 顺序中的日期可以使用简单的 alpha 排序进行排序跨度>

标签： javascript jquery angularjs datatable angular8

【解决方案1】：

尝试以下render 方法

render: function ( data, type) {

    var dateDisplay = data.split('-').reverse().join('-');
    return type === "display" || type === "filter" ? dateDisplay : data;
}

基于：datatables manual for render function 请参阅“转换数据”

作为奖励，我提供了一种更简单的方法来将 yyyy-mm-dd 更改为 dd-mm-yyyy

【讨论】：