CODEWITHSUNDEEP
javascriptangular
chirag
chirag

Reputation: 1779

Angular 9: Indian Number Format with number pipe and locale 'en-IN'?

I have code like this in angular 9:

main.ts

import { LOCALE_ID } from '@angular/core';
platformBrowserDynamic().bootstrapModule(AppModule,{
  providers: [{provide: LOCALE_ID, useValue: 'en-IN' }]
})

test.component.html

{{total | number:'1.2-2':'en-IN'}}

test.component.ts

total = 155000;

I am using number pipe with Locale 'en-IN'.

I want result like this: 1,55,000

But I am getting like this: 155,000

I want result in Indian number format with Locale and number pipe only.

How to achieve this with number pipe and locale 'en-IN'?

Upvotes: 1

Views: 1560

Answers (2)

Chellappan வ
Chellappan வ

Reputation: 27419

To override default locale we need to import import-global-variants-of-the-locale-data, Try the following.

app.module.ts

import "@angular/common/locales/global/en-IN";

@NgModule({
  imports: [BrowserModule, FormsModule],
  declarations: [AppComponent, HelloComponent],
  providers: [{ provide: LOCALE_ID, useValue: "en-IN" }],
  bootstrap: [AppComponent]
})
export class AppModule {}

Example

Upvotes: 7

Charlie
Charlie

Reputation: 23838

You need to import the localeIn and register that in registerLocaleData

import localeIn from '@angular/common/locales/en-IN';
import { registerLocaleData } from '@angular/common';
registerLocaleData(localeIn);

Stackblitz

https://stackblitz.com/edit/angular-ivy-8jd54r

Upvotes: 1

Related Questions