Changelog says:
By default Angular now only contains locale data for the language en-US, if you set the value of LOCALE_ID to another locale, you will have to import new locale data for this language because we don’t use the intl API anymore.
But I can not find any reference what "importing" means, how to do it and I get
xxx.html:30 ERROR Error: Missing locale data for the locale "de-CH"
I configure locale with :
import { LOCALE_ID } from '@angular/core';
and
providers: [
{ provide: LOCALE_ID, useValue: 'de-CH' }
],
This is really hard to find in the current version :(. Here is what i found out:
The different locales are in the package @angular/common/locales/
. In your case this is:
import localeDECH from '@angular/common/locales/de-CH';
Now you need to register this locale definitions in your project. There is a function called registerLocaleData
that is located in: @angular/common
.
So your code in your app.module.ts
should look like this:
import {LOCALE_ID} from '@angular/core';
import { registerLocaleData } from '@angular/common';
import localeDECH from '@angular/common/locales/de-CH';
registerLocaleData(localeDECH);
@NgModule({
...
providers: [
{ provide: LOCALE_ID, useValue: 'de-ch' },
]
...
})
....
For
{ provide: LOCALE_ID, useValue: 'pt-BR' }
Use:
import { registerLocaleData } from '@angular/common';
import localePt from '@angular/common/locales/pt';
registerLocaleData(localePt);
Angular pipes can help you with internationalization: the DatePipe, CurrencyPipe, DecimalPipe and PercentPipe use locale data to format data based on the LOCALE_ID.
By default, Angular only contains locale data for en-US. If you set the value of LOCALE_ID to another locale, you must import locale data for that new locale. The CLI imports the locale data for you when you use the parameter --locale with ng serve and ng build.
If you want to import locale data for other languages, you can do it manually:
src/app/app.module.ts
content_copy
import { registerLocaleData } from '@angular/common';
import localeFr from '@angular/common/locales/fr';
registerLocaleData(localeFr);
The files in @angular/common/locales contain most of the locale data that you need, but some advanced formatting options might only be available in the extra dataset that you can import from @angular/common/locales/extra. An error message informs you when this is the case.
src/app/app.module.ts
content_copy
import { registerLocaleData } from '@angular/common';
import localeFrCa from '@angular/common/locales/fr-CA';
import localeFrCaExtra from '@angular/common/locales/extra/fr-CA';
registerLocaleData(localeFrCa, localeFrCaExtra);
See the table about old and new locale too
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With