如何在 Angular 中将日期设置为区域设置?

Question

所以我有一个角度应用程序(角度8(，将被英国，毛里求斯和南非使用(可能更多(。

如何根据用户的区域设置设置日期？

我会使用自定义管道吗？或者将其设置为app.module中的某种提供程序？

谢谢。

Answer 1

通常我使用时刻库，并会创建一个管道来以所需的语言格式化日期，例如

import { Pipe, PipeTransform } from '@angular/core';
import * as moment from 'moment';
@Pipe({
name: 'customdate'
})
export class CustomDatePipe implements PipeTransform {
constructor() { }
transform(value: any, lng:string) {
return moment(value).lang(lng).format("MMM");

}
}

所以例如

{{item.date | customdate ： 'en-us'}} =March

{{item.date | customdate ： 'de'}} =März

{{item.date | customdate ： 'es'}} =Marzo

Answer 2

在app.module中，我像这样设置MAT_DATE_LOCALE值：

providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: RequestInterceptor,
multi: true,
},
{ provide: MAT_DATE_LOCALE, useValue: 'ro-RO' },  //YOUR DESIRED LOCALE
DatePipe
],

此外，在其他控件(如mat-table我使用管道(中：

<td mat-cell *matCellDef="let element" class="alignLeft"> {{ element.Date | date: 'dd/MM/yyyy HH:mm' }}

当内容是动态的时，您可以尝试使用它：

import { LOCALE_ID, Inject } from '@angular/core';
...
constructor(
@Inject(LOCALE_ID) public locale: string
) { }

并将其作为参数发送到自定义管道或其他相关方法。

让我知道这是否适合您