Show two decimal places if decimal part is greater than 0 in angular 7

Question

I am working on an Angular 7 application. How to format the numbers as below:

2.14569 to 2.14
3.245 to 3.24
1.00 to 1

How can i achieve this in Angular. I have tried (| number:'1.2-2') this but it always give two decimal places like 4.00 but i want it to be 4. Basically my problem is that, if there is decimal part and that is greater than 0 then show only two decimal places otherwise just show simple number without decimal part.

There is a small change, what if i have to show only one decimal part ? @DeepshikhaChaudhary. What should be the expression then ? — Waleed Naveed, May 24 '19 at 10:05
number:'1.0-1', this is not working @DeepshikhaChaudhary, its still giving 2 decimals — Waleed Naveed, May 24 '19 at 10:09
`{{decimalValue.one | number:'1.0-1'}}` this should be the expression when you want to show only one digit after the decimal place. And for 2.0000 should work fine without any pipe. — Deepshikha Chaudhary, May 24 '19 at 10:10
Its not working, the type of my value on which i am applying this conversion is number, there is no decimal type in angular @DeepshikhaChaudhary — Waleed Naveed, May 24 '19 at 10:17
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/193877/discussion-between-waleed-naveed-and-deepshikha-chaudhary). — Waleed Naveed, May 24 '19 at 10:21

score 2 · Accepted Answer · answered May 24 '19 at 09:59

2

    // Data 
decimalValue = {
        one: 2.14569,
        two: 3.245,
        three: 1.00
      }

// HTML
    <div>{{decimalValue.one | number:'1.0-2'}}</div>
    <div>{{decimalValue.two | number:'1.0-2'}}</div>
    <div>{{decimalValue.three | number:'1.0-2'}}</div>

answered May 24 '19 at 09:59

Deepshikha Chaudhary

338
3
11

There is no need for that (one, two, three) after decimalValue @Deepshikha Chaudhary – Waleed Naveed May 24 '19 at 10:30

Show two decimal places if decimal part is greater than 0 in angular 7

1 Answers1