Limit to 2 decimal places with a simple pipe

Question

I have found an example which limits a number to 2 decimal places AND turns the figure into a currency amount- eg £2.55.

{{ number | currency : 'GBP' : true : '1.2-2'}}

Is there a simple pipe which does the same without applying a currency?

score 341 · Accepted Answer · answered Jul 19 '16 at 10:41

341

Currency pipe uses the number one internally for number formatting. So you can use it like this:

{{ number | number : '1.2-2'}}

answered Jul 19 '16 at 10:41

dfsq

191,768
25
236
258

3

[refer](https://angular.io/docs/ts/latest/api/common/index/DecimalPipe-pipe.html) for details regarding using number pipe – akhouri Apr 11 '17 at 00:39
18

This was helpful in understanding why `1.2-2` https://stackoverflow.com/questions/38477970/what-are-the-parameters-for-the-number-pipe-angular-2 – maudulus May 23 '17 at 02:16
How do I restrict it to have always maximum 3 digits and 2 decimals? – Protagonist May 29 '17 at 18:00
25

For future readers, `{{ x | number : '1.2'}}` is also valid and means the same thing. – Mark E. Haase Jun 28 '17 at 17:27
13

mehaase, is not the same. For example if you have 5.6 and 5.6789 the output will be 5.60 and 5.6789. So, the first parameter is the min and the second is the number of maximum digits. – Everton Santos Aug 11 '17 at 11:15
2

How to use Pipe to transform a number to 1 decimal place and without roundup. Ex: 345.678 => 345.6 – Brian Dec 01 '17 at 03:46
@Brian Implement custom pipe that maybe uses number internally and slices to necessary length. – dfsq Dec 01 '17 at 10:06

score 15 · Answer 2 · answered Sep 03 '20 at 01:06

It's Works

.ts -> pi = 3.1415

.html -> {{ pi | number : '1.0-2' }}

Ouput -> 3.14

if it has a decimal it only shows one
if it has two decimals it shows both

https://stackblitz.com/edit/angular-e8g2pt?file=src/app/app.component.html

this works for me!!! thanks!!

score 10 · Answer 3 · answered Apr 18 '19 at 07:22

10

Well now will be different after angular 5:

{{ number | currency :'GBP':'symbol':'1.2-2' }}

answered Apr 18 '19 at 07:22

pabloRN

866
10
19

1

He wants to show value without currency symbol so DecimalPipe will work for him. – Aneeq Azam Khan Feb 07 '20 at 07:33

score 7 · Answer 4 · answered Aug 28 '20 at 16:12

7

Simple solution

{{ orderTotal | number : '1.2-2'}}

//output like this

// public orderTotal = 220.45892221

//   {{ orderTotal | number : '1.2-2'}} 

// final Output
//  220.45

answered Aug 28 '20 at 16:12

Shashwat Gupta

5,071
41
33

Limit to 2 decimal places with a simple pipe

4 Answers4

Linked