Блог

Главная - Вопросы по программированию - Не удается отсортировать дату рождения с помощью datetime с плагином moment в проектах angular 2

Не удается отсортировать дату рождения с помощью datetime с плагином moment в проектах angular 2

#angular #datatables #momentjs

#angular #таблицы данных #momentjs

Вопрос:

У меня есть таблица, в которой отображаются идентификатор, имя и дата рождения, как показано ниже:

 <table id="example" class="display nowrap" style="width:100%">
  <tr>
    <td>id</td>
    <td>name</td>
    <td>date of birth</td>
  </tr>
  <tr *ngFor="let item of items">
    <td>{{ item.id }}</td>
    <td>{{ item.name }}</td>
    <td>{{ item.dob }}</td>
  </tr>
</table>

И у меня есть следующие коды для отображения таблицы данных:

 declare const $;
export class Sampleomponent implements OnInit {

items: any[] = [
{ 'id': 1, 'name': 'sample1', "dob": '1900-01-01T05:00:00'  },
{ 'id': 2, 'name': 'sample2', "dob": '1937-10-11T05:00:00'  },
{ 'id': 3, 'name': 'sample3', "dob": '1954-02-01T05:00:00'  },
{ 'id': 4, 'name': 'sample4', "dob": '1940-12-01T05:00:00'  },
{ 'id': 5, 'name': 'sample5', "dob": '1910-01-01T05:00:00'  },
{ 'id': 6, 'name': 'sample6', "dob": '1901-10-09T05:00:00'  },
];

ngOnInit() {
    setTimeout(() => {
      this.loadStyles();
    }, 300);
  }

loadStyles() {
$(function () {
  $.fn.dataTable.moment('dd/MM/yyyy');

  $('#example').DataTable( {
    dom: 'Bfrtip',
    title: 'test',
    buttons: [
        'excel', 'pdf', 'print'
    ]
  });
});
}

}

Эта таблица способна отображать таблицу и сортировать все столбцы, кроме столбца dob. Я следовал их документации, но это дало мне тот же результат. Дата рождения или любое другое поле даты не удалось отсортировать. Пожалуйста, предположите, что dob данные поступают с сервера в datetime формате и у меня есть все необходимые js-коды. Буду признателен за любую помощь!

Комментарии:

1. Правильно ли отображается поле dob в таблице, как dd/MM/yyyy ?

Ответ №1:

Вы приняли это немного не в том направлении:

  1. В таблицах данных вам нужно особенно заботиться о датах, только если они не поддаются анализу, т. е. для Date.parse() возврата NaN вам понадобится плагин / форматировщик.

  2. Плагин сортировки DataTables momentjs является таким средством форматирования. Он используется для преобразования данных в правильный анализируемый формат, а не для отображения данных.

  3. Ваши даты в полном порядке, moment.js не требуется. Встроенная сортировка прерывается, если, например, какая-либо из дат является незаконной null . Чтобы преодолеть это, вы можете принудительно type с помощью

     columns: [
      { data: 'dob', type: 'date' }
    ]
  1. Я полагаю, что вы действительно хотите показывать даты в формате DD/MM/YYYY ( dd/MM/yyyy возвращать что-то вроде Mo/01/yyyy ); вы можете использовать render обратный вызов для отображения отформатированных дат, сохраняя при этом собственную сортировку по дате и времени :
     columns: [
      { data: 'dob', 
        type: 'date',
        render: function(data, type) {
          return type == 'display' ? moment(data).format('DD/MM/YYYY') : data
        }
      } 
    ]