Chrome - toLocaleString() - Thousands separator is not working for Spanish

Question

In Chrome, when the locale is set in 'es' the thousands separator is not there.

If I use 4 digit number, there is not problem

Data Set:

(2500).toLocaleString('en')
"2,500"
(2500).toLocaleString('pt')
"2.500"
(2500).toLocaleString('es')
"2500"

(25000).toLocaleString('es')
"25.000"

Why is this happen?

Superabound

Answer 1

According to the CLDR, this is the intended behavior. The "Minimum Grouping Digits" is 2, meaning that, only when a number has 2 digits before the other 3 digits, the thousand separator would appear. Apparently, this was only applied to chrome, since other browsers are using the "old" specifications.

Check this https://st.unicode.org/cldr-apps/v#/es/Symbols/70ef5e0c9d323e01

A possible workaround I used FOR SPECIFIC CASES, is to set it to the German locale ("de") instead of Spanish:

(1000).toLocaleString("de")

"1.000"

Benzoyl

Great hack! very usefull! – Aphrodisia

Using an incorrect locale defeats the purpose of using the toLocaleString function. – Whoremaster

Answer 2

The behaviour is indeed the one mentioned in the accepted answer.

However, rather than using the workaround mentioned above which defeats the purpose of using the toLocaleString() function, I would suggest using the useGrouping: true parameter.

const number = 1000
const localNumber = number.toLocaleString("es-ES", { useGrouping: true })

console.log(localNumber)
// expected output: '1.000'

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat#usegrouping

Whoremaster

Answer 3

Note that using any Latin American Spanish locale will bypass the issue (and is a closer match to es-ES than using German).

Adenine

Nope. In Mexico we have 2,500 but they have 2.500 in Spain. – Judon

Answer 4

For me, works using both configuration. Follow the images.

Sorry, I forgot say that I'm using the plugin i18n to Vue.

Engedus

It works better when you include the actual code instead of a screenshot. – Monopolist