Number pipe either 0 or 2 decimal places

crollywood picture crollywood · Oct 23, 2017 · Viewed 12k times · Source

I'd like to achieve number formatting such that if the number is round there should be no decimal placeholders .00 and otherwise use 2 and only 2 decimal places. For example:

1.23    -> 1.23
1.23456 -> 1.24
1.2     -> 1.20
1.0     -> 1
1       -> 1

According to the docs, you can only specify range of decimal places (e.g. |number:'.0-2') and not specific choice (e.g. |number:'.0,2'); am i right or is there a way?

I'm aware I could achieve the same with some *ngIf-s but would like to avoid if possible.

Answer

Adam A picture Adam A · Oct 23, 2017

If you want to do more than one thing on your variable, the best practise is to create two diffrent pipes and use them together. Important is order from left to right. If you want to display only two digits you can use built-in pipes like deicmalPipe:

Angular Doc Or just check that topic: Stack overflow answer

If you want to display 1 not 1.00 you can create your custom pipe where it check if that characters are 00 or sth else. If it is 00 it return number without these digits.