How to use float filter to show just two digits after decimal point?

FlaskWsgiJinja2

Flask Problem Overview


I am using Flask/Jinja2 template to show a number using |float filter.

Here is my code

{% set proc_err = nb_err|length / sum * 100 %}
({{proc_err|float}}%)

Output is a bit awkward:

17/189 (8.99470899471%)

I am looking for a way to make the places after dot limited to a number e.g. 2.

Desired output:

17/189 (8.99%)

Flask Solutions


Solution 1 - Flask

It turns to be quite simple:

My code:

{% set proc_err = nb_err|length / sum * 100 %}
({{proc_err|float}}%)

Can be changed a bit with:

{% set proc_err = nb_err|length / sum * 100 %}
({{'%0.2f' % proc_err|float}}%)

or using format:

({{'%0.2f'| format(proc_err|float)}}%)

Reference can be found here on jinja2 github issue 70

Solution 2 - Flask

You can use round to format a float to a given precision.

Extracted from the docs:

round(value, precision=0, method='common')

Round the number to a given precision. The first parameter specifies the precision (default is 0), the second the rounding method:

  • common rounds either up or down
  • ceil always rounds up
  • floor always rounds down

If you don’t specify a method common is used.

{{ 42.55|round }}
    -> 43.0
{{ 42.55|round(1, 'floor') }}
    -> 42.5

Note that even if rounded to 0 precision, a float is returned. If you need a real integer, pipe it through int:

{{ 42.55|round|int }}
    -> 43

Solution 3 - Flask

Here is one approach ::

{{ "%.2f"|format(result) }}

Tweak it as you like :)

Solution 4 - Flask

(I'm assuming you use to Ionic v2)

Use this front-end code:

<div *ngIf="device.usage > 0">
   {{ Round(device.usage)}} min  
</div>

and put the following function into the .ts file:

Round(number):number
{
    return parseFloat(Number((number/1000) / 60).toFixed(2)); 
}

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionBlaiseView Question on Stackoverflow
Solution 1 - FlaskBlaiseView Answer on Stackoverflow
Solution 2 - FlaskPaolo CascielloView Answer on Stackoverflow
Solution 3 - FlaskAkash KandpalView Answer on Stackoverflow
Solution 4 - FlaskMohamathu RafiView Answer on Stackoverflow