填写这份《一分钟调查》,帮我们(开发组)做得更好!去填写Home

CurrencyPipe

把数字转换成金额字符串, 根据本地化规则进行格式化,这些规则会决定分组大小和分组分隔符、小数点字符以及其它与本地化环境有关的配置项。

Transforms a number to a currency string, formatted according to locale rules that determine group sizing and separator, decimal-point character, and other locale-specific configurations.

查看"说明"...

{{ value_expression | currency [ : currencyCode [ : display [ : digitsInfo [ : locale ] ] ] ] }}
      
      {{ value_expression | currency [ : currencyCode [ : display [ : digitsInfo [ : locale ] ] ] ] }}
    

NgModule

输入值

value any

要格式化为货币的数字。

The number to be formatted as currency.

参数

currencyCode string

ISO 4217 中的货币代码,比如 USD 表示美元,EUR 表示欧元。可以用 DEFAULT_CURRENCY_CODE 这个注入令牌来配置默认货币代码。

The ISO 4217 currency code, such as USD for the US dollar and EUR for the euro. The default currency code can be configured using the DEFAULT_CURRENCY_CODE injection token.

可选. 默认值是 undefined.

display string | boolean

货币指示器的格式,有效值包括:

The format for the currency indicator. One of the following:

  • code: 展示货币代码(如 USD)。

    code: Show the code (such as USD).

  • symbol(default): 展示货币符号(如 $

    symbol(default): Show the symbol (such as $).

  • symbol-narrow: 使用区域的窄化符号,它包括两个符号。 比如,加拿大元的符号是 CA$,而其窄化符号是 $。如果该区域没有窄化符号,则使用它的标准符号。

    symbol-narrow: Use the narrow symbol for locales that have two symbols for their currency. For example, the Canadian dollar CAD has the symbol CA$ and the symbol-narrow $. If the locale has no narrow symbol, uses the standard symbol for the locale.

  • String: 使用指定的字符串值代替货币代码或符号。 比如,空字符串将会去掉货币代码或符号。

    String: Use the given string value instead of a code or a symbol. For example, an empty string will suppress the currency & symbol.

  • Boolean(从 v5 开始已弃用):true 表示货币符号,false 表示货币代码。

    Boolean (marked deprecated in v5): true for symbol and false for code.

可选. 默认值是 'symbol'.

digitsInfo string

数字展现的选项,通过如下格式的字符串指定:
{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}

Decimal representation options, specified by a string in the following format:
{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}.

  • minIntegerDigits:在小数点前的最小位数。默认为 1

    minIntegerDigits: The minimum number of integer digits before the decimal point. Default is 1.

  • minFractionDigits:小数点后的最小位数。默认为 0

    minFractionDigits: The minimum number of digits after the decimal point. Default is 2.

  • maxFractionDigits:小数点后的最大为数,默认为 3。 如果没有提供,该数字就会根据 ISO 4217 规范进行适当的格式化。 比如,加拿大元具有 2 位数字,而智利比索则没有。

    maxFractionDigits: The maximum number of digits after the decimal point. Default is 2. If not provided, the number will be formatted with the proper amount of digits, depending on what the ISO 4217 specifies. For example, the Canadian dollar has 2 digits, whereas the Chilean peso has none.

可选. 默认值是 undefined.

locale string

要使用的本地化格式代码。 如果未提供,则使用 LOCALE_ID 的值,默认为 en-US。 参见为你的应用设置地区(locale)

A locale code for the locale format rules to use. When not supplied, uses the value of LOCALE_ID, which is en-US by default. See Setting your app locale.

可选. 默认值是 undefined.

参见

说明

Deprecation notice:

The default currency code is currently always USD but this is deprecated from v9.

In v11 the default currency code will be taken from the current locale identified by the LOCAL_ID token. See the i18n guide for more information.

If you need the previous behavior then set it by creating a DEFAULT_CURRENCY_CODE provider in your application NgModule:

{provide: DEFAULT_CURRENCY_CODE, useValue: 'USD'}
      
      {provide: DEFAULT_CURRENCY_CODE, useValue: 'USD'}
    

使用说明

下列代码展示了该管道如何根据多种格式规范把数字转换成文本字符串, 这里使用的默认语言环境是 en-US

The following code shows how the pipe transforms numbers into text strings, according to various format specifications, where the caller's default locale is en-US.

@Component({ selector: 'currency-pipe', template: `<div> <!--output '$0.26'--> <p>A: {{a | currency}}</p> <!--output 'CA$0.26'--> <p>A: {{a | currency:'CAD'}}</p> <!--output 'CAD0.26'--> <p>A: {{a | currency:'CAD':'code'}}</p> <!--output 'CA$0,001.35'--> <p>B: {{b | currency:'CAD':'symbol':'4.2-2'}}</p> <!--output '$0,001.35'--> <p>B: {{b | currency:'CAD':'symbol-narrow':'4.2-2'}}</p> <!--output '0 001,35 CA$'--> <p>B: {{b | currency:'CAD':'symbol':'4.2-2':'fr'}}</p> <!--output 'CLP1' because CLP has no cents--> <p>B: {{b | currency:'CLP'}}</p> </div>` }) export class CurrencyPipeComponent { a: number = 0.259; b: number = 1.3495; }
      
      @Component({
  selector: 'currency-pipe',
  template: `<div>
    <!--output '$0.26'-->
    <p>A: {{a | currency}}</p>

    <!--output 'CA$0.26'-->
    <p>A: {{a | currency:'CAD'}}</p>

    <!--output 'CAD0.26'-->
    <p>A: {{a | currency:'CAD':'code'}}</p>

    <!--output 'CA$0,001.35'-->
    <p>B: {{b | currency:'CAD':'symbol':'4.2-2'}}</p>

    <!--output '$0,001.35'-->
    <p>B: {{b | currency:'CAD':'symbol-narrow':'4.2-2'}}</p>

    <!--output '0 001,35 CA$'-->
    <p>B: {{b | currency:'CAD':'symbol':'4.2-2':'fr'}}</p>

    <!--output 'CLP1' because CLP has no cents-->
    <p>B: {{b | currency:'CLP'}}</p>
  </div>`
})
export class CurrencyPipeComponent {
  a: number = 0.259;
  b: number = 1.3495;
}