Angular 2/4/5 在表达式中显示带有后缀(st、rd 和 th)的日期

Question

在 Angular 2/4/5/... 中向日期添加后缀(st、rd 和 th)的最佳“Angular 方式”是什么？

例如:Angular 表达式中的 2 月 25 日、3 月 1 日、4 月 2 日 {{item |日期:???}}

后缀选项似乎没有包含在 Angular Date Pipe 中医生。

Answer 1

谢谢罗迪，

与此同时，Angular 团队为日期后缀提出了一些核心功能，这是我提出的简单管道。

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

@Pipe({ name: 'dateSuffix' })
export class DateSuffix implements PipeTransform {
    transform(value: string): string {

    let suffix = 'th',
        day = value;

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

        return suffix;

    }
}

一旦导入到组件中...

我用这样的表达方式

{{record.RecordDate | date: "MMM.d"}} 
<span class="text-superscript">
    {{(record.RecordDate | date: "d") | dateSuffix}}
</span>

输出类似 Apr.3rd 的内容