I am using a DecimalPipe in my Angular application to display numbers, but the problem is that the default locale for the decimal pipe is 'en-us'. Thus the number one million is formatted as
1,000,000
. I however am a European and I want it to be 1 000 000
. Simply hardcoding the locale in the decimale pipe is not an option as I do want Americans to have it displayed in their locale, and Europeans in our locale.
Some solutions suggested using LOCALE_ID
. E.g.
constructor(
@Inject(LOCALE_ID) public locale: string
) { }
Which defaults to 'en-us' even though my browser is in the first place in Dutch (no country specified) and in the second place in English (also without country specified). Some other solutions suggested
providers: [ { provide: LOCALE_ID, useValue: 'fr' } ]
But then again, this is hardcoded and I need it to be dependent on the browser. Another solution was requesting the user's language throug Navigator.language
but this is often only a language and no country ergo no locale.
How could I request the locale and do a fallback on e.g. 'en-us' when none can be found?