Angular8：全局日期格式配置答案

【问题标题】：Angular8: Global date format configAngular8：全局日期格式配置
【发布时间】：2019-12-31 08:59:50
【问题描述】：

我正在使用 Angular8 并想格式化日期和时间，但我必须一次又一次地使用具有相同格式模式的日期管道，如下所示

<p>{{ myDate | date: 'dd MMM yyyy, h:mm a' }}</p>
<p>{{ myOtherDate date: 'dd MMM yyyy, h:mm a' }}</p>
<p>{{ otherVar }}</p>
<p>{{ myOtherOtherDate date: 'dd MMM yyyy, h:mm a' }}</p>

我的项目的每个组件都将使用相同的格式date: 'dd MMM yyyy, h:mm a'。

有没有办法可以在我的应用模块的提供者中提供全局配置，就像这样

@NgModule({
    providers: [
        {provide: LOCAL_PIPE_DATE_PATTERN, useValue: 'ddMMyy'},
    ],
})
export class AppModule {}

只使用日期管道

<p>{{ myDate | date }}</p>
<p>{{ myOtherDate | date }}</p>
<p>{{ otherVar }}</p>
<p>{{ myOtherOtherDate | date:'MMyyDD' }}</p> (If format changed)

【问题讨论】：

您可以创建一个使用LOCAL_PIPE_DATE_PATTERN 并在内部使用角度日期管道的自定义管道。这样，您还可以包含需要在您的应用程序中全局添加的任何其他格式，例如，如果您想添加前缀或后缀。

标签： javascript angular date-formatting angular8 angular-date-format

【解决方案1】：

您可以在项目中创建一个新的日期管道并始终初始化格式

@Pipe({
    name: "myDate"
})
export class MyDatePipe {

    constructor(private datePipe: DatePipe) {}

    transform(value: any): string {
        let format = "dd MMM yyyy, h:mm a";
        return this.datePipe.transform(new Date(value), format);
    }
}

【讨论】：

【解决方案2】：

您可以在 ts 文件中创建一个本地 DatePipe 并将日期转换为您最常用的格式，其余时间使用它自己的管道。

    yourNormalDateString : Date = new Date();
    datePipe = new DatePipe('YOUR_LOCAL_CODE');
    dateToDisplay = this.datePipe.transform(this.yourNormalDateString, 'Your Date Format String');

【讨论】：