📜  Angular 表单格式货币指令

📅  最后修改于: 2022-05-13 01:56:42.114000             🧑  作者: Mango

Angular 表单格式货币指令

在本文中,我们将了解 Angular 10 中的 formatCurrency 是什么以及如何使用它。 formatCurrency用于使用语言环境规则将数字格式化为货币。

句法:

formatCurrency(value, locale, currency, currencyCode, digitsInfo)

参数:

  • value:要格式化的数字。
  • locale:区域设置格式的区域设置代码。
  • 货币:包含货币符号或其名称的字符串。
  • currencyCode:货币代码。
  • digitsInfo:十进制表示选项。

返回值:

  • 字符串:格式化的货币代码。

NgModule:formatCurrency使用的模块是:

  • 通用模块

方法:

  • 创建要使用的 Angular 应用程序。
  • 在 app.module.ts 中导入 LOCALE_ID,因为我们需要导入语言环境以使用 get formatCurrency。
    import { LOCALE_ID, NgModule } from '@angular/core';
  • 在 app.component.ts 中导入 formatCurrency 和 LOCALE_ID
  • 注入 LOCALE_ID 作为公共变量。
  • 在 app.component.html 中使用字符串插值显示局部变量
  • 使用 ng serve 为 Angular 应用程序提供服务以查看输出。

示例 1:

app.component.ts
import {
  formatCurrency
 }
  from '@angular/common';
  
import {Component,
  Inject,
  LOCALE_ID }
  from '@angular/core';
  
@Component({
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent {
curr = formatCurrency(10,this.locale,
          'USD');
constructor(
  @Inject(LOCALE_ID) public locale: string,){}
}


app.component.html

  GeeksforGeeks

  

Locale Currency is : {{curr}}



app.component.ts
import {
  formatCurrency
 }
  from '@angular/common';
  
import {Component,
  Inject,
  LOCALE_ID }
  from '@angular/core';
  
@Component({
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent {
curr = formatCurrency(10,this.locale,
          'INR');
constructor(
  @Inject(LOCALE_ID) public locale: string,){}
}


app.component.html

  GeeksforGeeks

  

Locale Currency is : {{curr}}



app.component.html

  GeeksforGeeks

  

Locale Currency is : {{curr}}

输出:

示例 2:

app.component.ts

import {
  formatCurrency
 }
  from '@angular/common';
  
import {Component,
  Inject,
  LOCALE_ID }
  from '@angular/core';
  
@Component({
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent {
curr = formatCurrency(10,this.locale,
          'INR');
constructor(
  @Inject(LOCALE_ID) public locale: string,){}
}

app.component.html

  GeeksforGeeks

  

Locale Currency is : {{curr}}

输出:

参考: https://angular.io/api/common/formatCurrency