How to change date language Data pipe Angular 6?

Question

How to change date language Data pipe Angular 6?

Navigation

#1 by (5 votes)
#2 by (0 votes)

1

I would like to change the language of the date of my app to be from Argentina, I tried with this configuration looking at the documentation of angular but it remains unchanged. There remains the default configuration that is en-US. It does not show me any errors by console

app.module.ts

import { registerLocaleData } from '@angular/common';
import localeEsAr from '@angular/common/locales/es-AR';
registerLocaleData(localeEsAr);

app.component.html

<td>{{resultado.date?.seconds * 1000| date:'fullDate'}}</td>

angular

asked by Fabricio Loupias 07.09.2018 в 18:31

source

2 answers

0

The problem is how you are setting up the location. Of the official documentation, this is what goes in app.module.ts :

import { LOCALE_ID, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent } from '../src/app/app.component';

@NgModule({
  imports: [ BrowserModule ],
  declarations: [ AppComponent ],
  providers: [ { provide: LOCALE_ID, useValue: 'fr' } ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

The method that you use to register the locale, I understand that it is useful if you are going to use multiple locations and not just one.

In that case, you would have to indicate which locale you are going to use in the pipe.

answered by 07.09.2018 в 18:54

Problem when printing variables in structure I do not jump the error when I enter a negative error

score 5 · Accepted Answer

What you need to do is to import the premises of angular common local, also register them to be able to use them, that should solve your error of

'Missing locale data for the locale' is-AR "'

and if you keep throwing the same error check your local folder if it contains is-Ar, in your case you should only import is-Ar, in my example shows several other local

    import { LOCALE_ID, NgModule } from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
    import { AppComponent } from '../src/app/app.component';
    import { registerLocaleData } from '@angular/common';

    // importar locales
    import localePy from '@angular/common/locales/es-PY';
    import localePt from '@angular/common/locales/pt';
    import localeEn from '@angular/common/locales/en';
    import localeEsAr from '@angular/common/locales/es-AR';

    // registrar los locales con el nombre que quieras utilizar a la hora de proveer
    registerLocaleData(localePy, 'es');
    registerLocaleData(localePt, 'pt');
    registerLocaleData(localeEn, 'en')
    registerLocaleData(localeEsAR, 'es-Ar');

    @NgModule({
      imports: [ BrowserModule ],
      declarations: [ AppComponent ],
      // Aqui usas el nombre que hayas colocado al locale, en este caso es-Ar o pt o en, etc
      providers: [ { provide: LOCALE_ID, useValue: 'es-Ar' } ],
      bootstrap: [ AppComponent ]
    })
    export class AppModule { }