Отсутствуют данные локали для локали "XXX" с angular

В настоящее время я определяю "LOCALE_ID" на "en-US" следующим образом:

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

и он работает очень хорошо. Однако, чтобы проверить, как даты выглядят на французском языке, я заменил "en-US" на "fr-FR", а затем получил ошибку:

Отсутствуют данные локали для локали "fr-FR".

Я сделал несколько исследований, и я не нашел ничего связанного с этим. Являются ли языковые стандарты для французского языка включенными в пакет по умолчанию? Это другой пакет? Нужно ли создавать их самостоятельно?

Ответ 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.io/api/common/DatePipe)

Ответ 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 {}