缺少具有角度的区域设置“XXX”的区域设置数据

时间:2017-09-26 06:12:55

标签: angular angular-i18n

我目前在“ en-US ”上定义“ LOCALE_ID ”:

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

它运作良好。但是,为了测试法语中日期的样子,我用“ fr-FR ”替换了“ en-US ”然后我收到了错误:

  

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

我做了一些研究,但没有发现任何相关内容。法语的语言环境是否包含在默认包中?这是一个不同的包吗?我必须自己制作它们吗?

3 个答案:

答案 0 :(得分:24)

在档案app.module.ts

...
import { NgModule, LOCALE_ID } from '@angular/core';
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.io/api/common/DatePipe

答案 1 :(得分:1)

感谢@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 {}

答案 2 :(得分:0)

请看一下 https://github.com/angular/angular-cli/issues/6683

这可能是你的情况