填寫這份《一分鐘調查》,幫我們(開發組)做得更好!去填寫Home

DecimalPipe

把數字轉換成字串, 根據本地化規則進行格式化,這些規則會決定分組大小和分組分隔符、小數點字元以及其它與本地化環境有關的配置項。

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

檢視"說明"...

{{ value_expression | number [ : digitsInfo [ : locale ] ] }}
      
      {{ value_expression | number [ : digitsInfo [ : locale ] ] }}
    

NgModule

輸入值

value string | number

引數

digitsInfo string
可選. 預設值是 `undefined`.
locale string
可選. 預設值是 `undefined`.

參見

說明

如果沒有指定引數,則該函式會使用這個舍入方法。 但其行為與 JavaScript 的 Math.round() 函式不同。 下面的例子展示了管道與 Math.round() 的對比:

If no parameters are specified, the function rounds off to the nearest value using this rounding method. The behavior differs from that of the JavaScript Math.round() function. In the following case for example, the pipe rounds down where Math.round() rounds up:

-2.5 | number:'1.0-0' > -3 Math.round(-2.5) > -2
      
      -2.5 | number:'1.0-0'
> -3
Math.round(-2.5)
> -2
    

使用說明

下列程式碼展示了該管道如何根據多種格式規範來把數字轉換成字串,這裡使用的預設語言環境是 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.

例子

Example

@Component({ selector: 'number-pipe', template: `<div> <!--output '2.718'--> <p>e (no formatting): {{e | number}}</p> <!--output '002.71828'--> <p>e (3.1-5): {{e | number:'3.1-5'}}</p> <!--output '0,002.71828'--> <p>e (4.5-5): {{e | number:'4.5-5'}}</p> <!--output '0 002,71828'--> <p>e (french): {{e | number:'4.5-5':'fr'}}</p> <!--output '3.14'--> <p>pi (no formatting): {{pi | number}}</p> <!--output '003.14'--> <p>pi (3.1-5): {{pi | number:'3.1-5'}}</p> <!--output '003.14000'--> <p>pi (3.5-5): {{pi | number:'3.5-5'}}</p> <!--output '-3' / unlike '-2' by Math.round()--> <p>-2.5 (1.0-0): {{-2.5 | number:'1.0-0'}}</p> </div>` }) export class NumberPipeComponent { pi: number = 3.14; e: number = 2.718281828459045; }
      
      @Component({
  selector: 'number-pipe',
  template: `<div>
    <!--output '2.718'-->
    <p>e (no formatting): {{e | number}}</p>

    <!--output '002.71828'-->
    <p>e (3.1-5): {{e | number:'3.1-5'}}</p>

    <!--output '0,002.71828'-->
    <p>e (4.5-5): {{e | number:'4.5-5'}}</p>

    <!--output '0 002,71828'-->
    <p>e (french): {{e | number:'4.5-5':'fr'}}</p>

    <!--output '3.14'-->
    <p>pi (no formatting): {{pi | number}}</p>

    <!--output '003.14'-->
    <p>pi (3.1-5): {{pi | number:'3.1-5'}}</p>

    <!--output '003.14000'-->
    <p>pi (3.5-5): {{pi | number:'3.5-5'}}</p>

    <!--output '-3' / unlike '-2' by Math.round()-->
    <p>-2.5 (1.0-0): {{-2.5 | number:'1.0-0'}}</p>
  </div>`
})
export class NumberPipeComponent {
  pi: number = 3.14;
  e: number = 2.718281828459045;
}