缺少与Angular相关的"XXX"语言环境数据

Question

我目前是这样在"en-US"中定义"LOCALE_ID"的：

@NgModule({
    providers: [{ provide: LOCALE_ID, useValue: "en-US" }, ...],
    imports: [...],
    bootstrap: [...]
})

它运行得相当好。然而，为了测试日期在法语中的显示样式，我把“en-US”替换为“fr-FR”，然后收到了以下错误信息：

缺少区域设置“fr-FR”的区域数据。

我进行了一些研究，但没有找到任何相关的内容。法语的区域设置是否包含在默认包中？还是有不同的包？我需要自己创建它们吗？

- ssougnez

---

Angular 的国际化指南可以帮助您将应用程序本地化为不同的语言和地区。要开始使用 Angular 的 i18n 功能，您需要向模板中添加特殊属性，并使用这些属性来标记可本地化的文本。然后，您可以使用命令行工具来提取这些文本，并将它们翻译成所需的目标语言。最后，您可以将这些翻译后的文本重新插入到应用程序中，以便在运行时正确显示用户的语言偏好设置。 - JB Nizet

啊！非常感谢，我看到了那篇文章，但是错过了“i18n管道”部分。这些文章太长了。非常感谢，现在它可以工作了;-) - ssougnez

Answer 1

在app.module.ts文件中

...
import { NgModule, LOCALE_ID } from '@angular/core';
import { registerLocaleData } from '@angular/common';
import localeFr from '@angular/common/locales/fr';
registerLocaleData(localeFr);


@NgModule({
  imports: [...],
  declarations: [...],
  bootstrap: [...],
  providers: [
    { provide: LOCALE_ID, useValue: 'fr-FR'},
  ]
})
export class AppModule {}

（来源：https://next.angular.io/guide/i18n）

在模板文件（*.component.html）中：

DATE in FRENCH: {{ dateEvent | date: 'longDate'}}

结果：

DATE in FRENCH: 25 mars 2018

(来源: https://angular.cn/api/common/DatePipe)

- Alan

---

终于找到了方法。谢谢。 - sandyiit

registerLocaleData(localeFr); 这个函数调用是一个纯副作用，会被树摇除去；换句话说，如果你使用 "sideEffects": false 启用了树摇，则在开发环境下它可以工作但在生产环境中会失败。最好将这个函数调用放入 AppModule 构造函数中。 - vbraun

我遇到了同样的问题，错误信息为：“管道'DatePipe'缺少区域设置数据“hu”。这个问题已经解决了。谢谢！ - Kristóf Dombi

Answer 2

谢谢@Alan，你只是忘了这个：import { registerLocaleData } from '@angular/common';

完整代码：

import { registerLocaleData } from '@angular/common';
import localeFr from '@angular/common/locales/fr';
registerLocaleData(localeFr);

@NgModule({
  imports: [...],
  declarations: [...],
  bootstrap: [...],
  providers: [
    { provide: LOCALE_ID, useValue: 'fr-FR'},
  ]
})
export class AppModule {}

- Adrien V

Answer 3

请检查您的message.json或任何其他文件，确保您的语言环境设置正确。

- Mo D Genesis

Answer 4

请查看https://github.com/angular/angular-cli/issues/6683，这可能是您的情况。

- Fadi Abo Msalam

---

嗨，我没有使用angular-cli，JB Nizet提供的答案解决了我的问题，谢谢;-) - ssougnez

如果某个答案帮助您解决了问题，您应该将其接受为答案。这不仅有助于提供答案的人获得声誉和回报，也有助于通过获取正确答案来帮助社区。 - Giannis Paraskevopoulos

我接受了其他答案，因为它是最接近我的问题的答案。 - ssougnez