Angular设置LOCALE_ID为en-GB后datePipe日期格式异常如何解决

Angular 默认只会打包 angular.json 中 sourceLocale 对应语言的区域规则数据，你配置的 en-GB 区域数据没有被主动注册，Angular 找不到对应格式化规则时会自动 fallback 到默认的 en-US 规则，所以输出的是美式日期格式 November 16, 2021，而非你预期的英式日期。

• 首先在 app.module.ts 头部导入区域数据注册函数和 en-GB 对应的区域数据：

import { registerLocaleData } from '@angular/common';
import localeEnGb from '@angular/common/locales/en-GB';

• 在 @NgModule 声明前调用注册函数完成 en-GB 区域数据注册：

registerLocaleData(localeEnGb);

• 保持你现有的 LOCALE_ID 提供者配置不变即可：

providers: [
  {
    provide: LOCALE_ID,
    useValue: "en-GB"
  }
]

如果你后续需要切换使用 nl-NL 荷兰语格式，同样需要手动导入并注册荷兰语区域数据：

import localeNl from '@angular/common/locales/nl';
registerLocaleData(localeNl);

修改 angular.json 的 sourceLocale 能够生效的原因是，Angular 构建时会自动打包 sourceLocale 对应的区域数据，无需手动注册。

内容的提问来源于stack exchange，提问作者bolemeus