i18n pipes not using the LOCALE_ID by default

[elias-garcia]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

When setting the LOCALE_ID token to a locale different than the default, the value gets changed, but when using a i18n pipe like the CurrencyPipe it's not reading the new LOCALE_ID value as expected. The new locale data is registered as the documentation says and also the LOCALE_ID token is provided as the documentation says.

Expected behavior

Any of the i18n pipes should use the LOCALE_ID value as the default locale.

Minimal reproduction of the problem with instructions

I have created a minimal StackBlitz reproducing the issue here.

What is the motivation / use case for changing the behavior?

The i18n pipes should use the LOCALE_ID by default as the documentation says.

Environment

Angular version: 5.2.1

Browser:
- [x] Chrome (desktop) version 63.0.3239.132

For Tooling issues:
- Node version: 8.8.0 
- Platform:  macOS High Sierra 10.3.2

[ocombe]

Is it using "es" in your example, take a look at this stackblitz: https://stackblitz.com/edit/angular-z9up4h?file=app/app.component.html
The locale will only change the formatting for the currency pipe, it will not change the currency itself.
To do that you should set the currency code that you want to use yourself (first parameter of the currency pipe), see the documentation for that: https://angular.io/api/common/CurrencyPipe
The locale will never change the currency code that you use because it makes no sense, $10 is the same value in all locales, you will just write it differently ($10 in english, 10 $ in spanish)

[luckylooke]

@ocombe please can you tell me how can you make other locales work?
https://stackblitz.com/edit/angular-ghh8mh?file=app/app.component.html
Many thanks

[trotyl]

@luckylooke Currency is not bound to locale, you'll need to specify it:

https://stackblitz.com/edit/angular-mjw5d6?file=app/app.component.html

As you can see there're 20 currencies supported in locale es, how could Angular guess which is your expected one:

    {
        'AUD': [, '$'],
        'BRL': [, 'R$'],
        'CNY': [, '¥'],
        'EGP': [],
        'ESP': ['₧'],
        'GBP': [, '£'],
        'HKD': [, '$'],
        'ILS': [, '₪'],
        'INR': [, '₹'],
        'JPY': [, '¥'],
        'KRW': [, '₩'],
        'MXN': [, '$'],
        'NZD': [, '$'],
        'RON': [, 'L'],
        'THB': ['฿'],
        'TWD': [, 'NT$'],
        'USD': ['US$', '$'],
        'XAF': [],
        'XCD': [, '$'],
        'XOF': []
    }

[luckylooke]

Thanks @trotyl but I would expect that one currency is default for each locale. I was testing different locales because I need thousands separator " " (space), so I wanted to change locale, because some countries have such separator. I have made custom pipe for it, but using small hack with locale would be nicer.

I have made changes according to your example and still getting same results. Do not tell me that Germany, French or Slovakia do not use EURO currency ;)

https://stackblitz.com/edit/angular-aqinfp?file=app/app.component.html

[trotyl]

@luckylooke You only used locale es.

[luckylooke]

@trotyl aaa heeere it iis... I did not know that it have to be loaded... I was looking for such info but have not found it... thanks 🎉

[ocombe]

yes, you have to load the locales, as explained here: https://angular.io/guide/i18n#i18n-pipes

[luckylooke]

@ocombe thanks, I have missed it somehow.. RTFM 🤦‍♂️ .. Now I can use my locale hack to format numbers with space thousands separator without dedicated pipe for it. https://stackblitz.com/edit/angular-ipawcb?file=app%2Fapp.component.html 👍

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}