En este artículo, vamos a ver qué es getLocaleCurrencySymbol en Angular 10 y cómo usarlo.
El símbolo getLocaleCurrency
Sintaxis:
getLocaleCurrencySymbol(locale: string): string | null
NgModule: el módulo utilizado por getLocaleCurrencySymbol es:
- CommonModule
Acercarse:
- Cree la aplicación angular que se utilizará
- En app.module.ts importa LOCALE_ID porque necesitamos importar la configuración regional para usar getLocaleCurrencySymbol.
import { LOCALE_ID, NgModule } from '@angular/core';
- En app.component.ts importe getLocaleCurrencySymbol y LOCALE_ID
- inyecta LOCALE_ID como una variable pública.
- En app.component.html muestra la variable local usando la interpolación de strings
- sirva la aplicación angular usando ng serve para ver el resultado.
Parámetros:
- locale: Una string que contiene el código local con reglas.
Valor de retorno:
- string: string que contiene el símbolo de la moneda.
Ejemplo 1:
app.module.ts
import { LOCALE_ID, NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, AppRoutingModule ], providers: [ { provide: LOCALE_ID, useValue: 'en-GB' }, ], bootstrap: [AppComponent] }) export class AppModule { }
app.component.ts
import {FormStyle, getLocaleCurrencySymbol, TranslationWidth } from '@angular/common'; import {Component, Inject, OnInit, LOCALE_ID } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html' }) export class AppComponent { sym = getLocaleCurrencySymbol(this.locale); constructor( @Inject(LOCALE_ID) public locale: string,){} }
app.component.html
<h1> GeeksforGeeks </h1> <p>Locale Currency symbol is : {{sym}}</p>
Producción:
Ejemplo 2:
app.module.ts
import { LOCALE_ID, NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, AppRoutingModule ], providers: [ { provide: LOCALE_ID, useValue: 'en-GB' }, ], bootstrap: [AppComponent] }) export class AppModule { }
app.component.ts
import {FormStyle, getLocaleCurrencySymbol, TranslationWidth } from '@angular/common'; import { Component, Inject, OnInit, LOCALE_ID } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html' }) export class AppComponent { sym = getLocaleCurrencySymbol(this.locale); constructor( @Inject(LOCALE_ID) public locale: string,){} }
app.component.html
<h1> GeeksforGeeks </h1> <p>Currency symbol is : {{sym}}</p> <p> {{sym}}100 {{sym}}200 {{sym}}300 {{sym}}400 {{sym}}500 </p>
Producción:
Referencia:https://angular.io/api/common/getLocaleCurrencySymbol