This page was translated from English by the community. Learn more and join the MDN Web Docs community.

View in English Always switch to English

Форматирование даты при помощи moment

По умолчанию отображение дат наших моделей некрасиво: Tue Dec 06 2016 15:49:58 GMT+1100 (AUS Eastern Daylight Time). В этом разделе мы покажем, как можно обновить страницу списка BookInstance List из предыдущего раздела, чтобы представить поле due_date в более удобном формате: December 6th, 2016.

Подход, который будет использован, состоит в создании виртуального свойства в модели BookInstance, которое будет возвращать отформатированную дату. Форматирование будет производиться с использованием moment, легковесной библиотеки JavaScript для разбора, проверки, изменения и форматирования дат.

Примечание: Можно применять moment для форматирования непосредственно в шаблонах Pug, а можно отформатировать строку в других местах. Использование виртуального свойства позволяет получить дату, отформатированную точно так же, как при помощи due_date.

Установка moment

Ведите следующую команду в корне проекта:

bash
npm install moment

Создание виртуального свойства

  1. Откройте файл ./models/bookinstance.js.

  2. В начало файла введите строку для импортирования moment.

    js
    var moment = require("moment");
    

Добавьте виртуальное свойство due_back_formatted сразу после свойства url.

js
BookInstanceSchema.virtual("due_back_formatted").get(function () {
  return moment(this.due_back).format("MMMM Do, YYYY");
});

Примечание: Метод format может вывести дату почти в любом формате. Синтаксис для представления различных составляющих даты можно найти в документации.

Обновляем представление

Откройте файл /views/bookinstance_list.pug и замените due_back на due_back_formatted.

js
      if val.status!='Available'
        //span  (Due: #{val.due_back} )
        span  (Due: #{val.due_back_formatted} )

Вот и все. Если вы перейдёте к All book-instances в боковом меню, вы должны увидеть все даты в привлекательном формате!

Далее