How to use LOCALE_ID 'es-ES' in ionic 2?

1

I have a project in:

Ionic Framework: 3.9.2
Ionic App Scripts: 3.1.8
Angular Core: 5.0.3
Angular Compiler CLI: 5.0.3
Node: 6.7.0
OS Platform: Windows 8.1
Navigator Platform: Win32
User Agent: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.132 Safari/537.36

and I have to represent a monetary figure in Colombian pesos, for that I use the coin pipe {{variable | currency:'COP':'0.0-0'}} , but the result is the next $3,055.70 but I am required that the thousands separator be with . and the one of decimals with , , I have read the documentation of currency and it says that you must configure the locale variable in the following way {{variable | currency:'COP':'0.0-0':'es'}} but this causes the following error:

ERROR Error: Missing locale data for the locale "es".
    at findLocaleData (common.js:1475)
    at getLocaleNumberFormat (common.js:1318)
    at formatNumber$1 (common.js:4913)
    at CurrencyPipe.transform (common.js:6151)
    at checkAndUpdatePureExpressionInline (core.js:12908)
    at checkAndUpdateNodeInline (core.js:13602)
    at checkAndUpdateNode (core.js:13541)
    at debugCheckAndUpdateNode (core.js:14413)
    at debugCheckRenderNodeFn (core.js:14392)
    at Object.eval [as updateRenderer] (PPendonPage.html:197)

I have also tried to change the default language of the app, pass it from 'en-US' to 'es-ES' in the following way,

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { LOCALE_ID } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';


import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

@NgModule({
  declarations: [
    MyApp,
    HomePage,
    ListPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp, {
      backButtonText: '',
      mode: 'ios',
    })
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    ListPage    
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    {provide: LOCALE_ID, useValue: 'es-ES' }
  ]
})
export class AppModule {}

in the same way the error comes out:

Error: Missing locale data for the locale "es-ES".
    at findLocaleData (http://localhost:8100/build/vendor.js:45511:11)
    at getLocaleNumberFormat (http://localhost:8100/build/vendor.js:45354:33)
    at formatNumber$1 (http://localhost:8100/build/vendor.js:48949:35)
    at CurrencyPipe.transform (http://localhost:8100/build/vendor.js:50187:18)
    at checkAndUpdatePureExpressionInline (http://localhost:8100/build/vendor.js:13255:38)
    at checkAndUpdateNodeInline (http://localhost:8100/build/vendor.js:13955:20)
    at checkAndUpdateNode (http://localhost:8100/build/vendor.js:13894:16)
    at debugCheckAndUpdateNode (http://localhost:8100/build/vendor.js:14766:76)
    at debugCheckRenderNodeFn (http://localhost:8100/build/vendor.js:14745:13)
    at Object.eval [as updateRenderer] (ng:///AppModule/PPendonPage.ngfactory.js:736:48)

How do I successfully use {provide: LOCALE_ID, useValue: 'es-ES' } ?

    
asked by Daniel Enrique Rodriguez Caste 13.02.2018 в 17:42
source

1 answer

1

You have to import the " Locale " you need to use:

import es from '@angular/common/locales/es';
import { registerLocaleData } from '@angular/common';

registerLocaleData(es);

You can look at the available locations here

    
answered by 13.02.2018 / 18:16
source