Search code examples
angularangular-pipe

Making one digit number as two digit using Angular Pipes

I wanted to make 1 look as 01 on html and similarly 11 as 11.

Can anyone please help me if there are such filters. Here is a sample demo code

Solution

  • Angular provides Decimal Pipes for these kind of situations. See a similar answer here.

    <span>{{ number | number:'2.0' }}</span>

    The Decimal Pipe's parameter accepts a string that represents your desired format. According to the docs, the format looks like this:

    number: '{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}'

    Where:

    • minIntegerDigits: The minimum number of integer digits before the decimal point. Default is 1.
    • minFractionDigits: The minimum number of digits after the decimal point. Default is 0.
    • maxFractionDigits: The maximum number of digits after the decimal point. Default is 3.