Как настроить формат date.now?

Question

.ts

currentDate = Date.now();

.html

{{ currentDate | date }}

Как можно отобразить время вместо 25 октября 2019 г. Я хочу это следующим образом:

Подписали этот {{25th}} день {{October}} {{2019}}?

Кто-нибудь уже реализовал пользовательский формат времени?

Answer 1

Полный стек с суффиксом и языковой поддержкой на месяц = ​​рабочая демонстрация здесь

Вы можете использовать этот канал:

import { Pipe, PipeTransform } from "@angular/core";

@Pipe({
  name: "customDatePipe",
  pure: true
})
export class CustomDatePipe implements PipeTransform {
  transform(date: Date): string {
    if (!date) {
      return;
    }

    const day = date.getDate();
    const monthName = new Intl.DateTimeFormat("en-US", { month: "long" })
      .format;
    const longName = monthName(date); // "July"
    const year = date.getFullYear();

    let suffix = "th";

    if (day === 1 || day === 21 || day === 31) {
      suffix = "st";
    }
    if (day === 2 || day === 22) {
      suffix = "nd";
    }
    if (day === 3 || day === 23) {
      suffix = "rd";
    }

       return `Signed this ${day}${suffix} day of ${longName} ${year}`
      }
   }

Answer 2

Вы можете реализовать пользовательский канал для суффикса даты и взять остаток из углового date канала.

import { Pipe, PipeTransform } from '@angular/core';

 @Pipe({ name: 'dateSuffix' })
 export class DateSuffixPipe implements PipeTransform {

    transform(date: Date): string {
      let day = date.getDay();
      let suffix = 'th';

      if (day == 1 || day == 21 || day == 31) {
        suffix = 'st';
      }
      if (day == 2 || day == 22) {
        suffix = 'nd';
      }
      if (day == 3 || day == 23) {
        suffix = 'rd';
      }

       return suffix;
    } 
 }

HTML

<div>
    Signed this {{currentDate | date:'dd'}}{{currentDate | dateSuffix}} day of {{currentDate | date:'LLLL yyyy'}}
</div>

Не забудьте добавитьВаш пользовательский канал для объявлений модуля!