Skip to content

CurrencyPipe use en-US locale by default instead of browser locale. #45409

@ghost

Description

Which @angular/* package(s) are the source of the bug?

common

Is this a regression?

No

Description

Environment:

  • OS: KDE-Neon 20.04 (which is a Ubuntu LTS 20.04)
  • Browser: Firefox 98.0.1 (64-Bit)
  • Angular-CLI: 13.1.4
  • Node: 16.13.1
  • NPM: npm 8.5.3

Browser-Settings:

  • navigator.language = "de-DE"
  • (new Intl.NumberFormat()).resolvedOptions().locale = "de-DE"
  • (new Intl.DateTimeFormat()).resolvedOptions().locale = "de-DE"

Observed Behavior:

Using currency pipe <div>{{ 12345.678 | currency }}</div> produces $12,345.67.


Expected Behavior:

Using currency pipe <div>{{ 12345.678 | currency }}</div> should produce either $12.345,67 or 12.345,67 $ because the decimal separator in locale "de-DE" is ,, not ., and the thousands-separator is ., not ,.

After debugging this I found out that, in the case of no locale being configured explicitly anywhere in the project, the currency pipe uses "en-US" as fallback locale to format numbers. The expected behavior is, that in the case of no explicit locale configuration by the developer, angular reads the corresponding locale (NumberFormat or DateTimeFormat) from the Intl-API to provide the user with a formatting that he wants to see, instead of the "en-US" one.

Please provide a link to a minimal reproduction of the bug

https://plnkr.co/edit/2LRZswU8FoDV4mqt?open=lib%2Fapp.ts&deferRun=1&preview

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 13.1.4
Node: 16.13.1
Package Manager: npm 8.5.3
OS: linux x64

Angular: 13.1.3
... animations, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1301.4
@angular-devkit/build-angular   13.1.4
@angular-devkit/core            13.1.4
@angular-devkit/schematics      13.1.4
@angular/cdk                    13.2.3
@angular/cli                    13.1.4
@angular/material               13.2.3
@schematics/angular             13.1.4
rxjs                            7.4.0
typescript                      4.5.5

Anything else?

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions