In Anqi CMS templates, handling floating-point number display, especially the need to remove unnecessary zeros at the end of numbers, is a practical demand that many website operators encounter. When our product prices are12.5000or a certain statistical number is34.00at this time, these extra zeros are not only not beautiful, but may also confuse visitors. At this time, the built-infloatformata filter can come into play.

floatformatHow does the filter prevent the display of extra zeros for floating-point numbers?

floatformatThe filter is used in Anqi CMS template rendering to format floating-point numbers specifically.Its greatest highlight lies in its ability to intelligently handle the redundant zeros after floating-point numbers, even when the value is an integer, the decimal point will also be removed, making the number appear in the simplest and most natural form.

When you use it directly like this{{ 你的浮点数 | floatformat }}When, the filter will try to retain one decimal place by default. However, if the decimal part is all zeros, or if there are no valid digits after rounding, it will automatically omit these zeros and the decimal point.For example:

  • If your variable ispricehas a value of12.50000, using{{ price | floatformat }}It will be displayed as12.5.
  • Ifpricehas a value of34.00000, using{{ price | floatformat }}It will be displayed as34The decimal point is also removed.
  • Ifpricehas a value of5.678It will be displayed as rounded due to5.7.

This is the default handling method that we hope to be the ideal solution for floating-point numbers not to show redundant zeros, which can make the numbers on the page look cleaner and more professional.

Of course,floatformatIt also provides more fine-grained control options. If you have specific requirements, and you want to display floating-point numbers with a fixed number of decimal places, even if the trailing zeros are displayed, you can achieve this by passing a numeric parameter to the filter, for example{{ 你的浮点数 | floatformat:2 }}This behavior will be different:

  • {{ 12.50000 | floatformat:2 }}It will be displayed as12.50.
  • {{ 34.00000 | floatformat:2 }}It will be displayed as34.00.
  • {{ 5.678 | floatformat:2 }}It will be displayed as5.68Rounding will still be performed here.

By this parameter, we can flexibly control the display accuracy and method of decimal places according to the actual display requirements of the website. If the parameter is set to0,floatformatRounds a number to the nearest whole integer.

Actual application example

Suppose we have a variable in the template.product_price, its value could be29.99000/150.00000or7.345.

  1. Remove redundant zeros and automatically adjust the number of decimal places (default behavior):

    <p>商品A价格:{{ product_price_A | floatformat }}</p> {# product_price_A = 29.99000,输出:29.99 #}
    <p>商品B价格:{{ product_price_B | floatformat }}</p> {# product_price_B = 150.00000,输出:150 #}
    <p>商品C价格:{{ product_price_C | floatformat }}</p> {# product_price_C = 7.345,输出:7.3 #}
    
  2. Round to two decimal places (even if it's zero):

    <p>商品A价格:{{ product_price_A | floatformat:2 }}</p> {# product_price_A = 29.99000,输出:29.99 #}
    <p>商品B价格:{{ product_price_B | floatformat:2 }}</p> {# product_price_B = 150.00000,输出:150.00 #}
    <p>商品C价格:{{ product_price_C | floatformat:2 }}</p> {# product_price_C = 7.345,输出:7.35 #}
    
  3. Round to the nearest whole number:

    <p>商品A价格:{{ product_price_A | floatformat:0 }}</p> {# product_price_A = 29.99000,输出:30 #}
    <p>商品B价格:{{ product_price_B | floatformat:0 }}</p> {# product_price_B = 150.00000,输出:150 #}
    <p>商品C价格:{{ product_price_C | floatformat:0 }}</p> {# product_price_C = 7.345,输出:7 #}
    

In summary, of Anqi CMS'sfloatformatThe filter is a very practical template tool that can help us elegantly handle the display issues of floating-point numbers.Especially the default "Remove redundant zeros" feature makes the number output more in line with daily reading habits, enhancing the professionalism and user experience of the website content.Whether it is pursuing a concise digital display or needing to be precise to a certain decimal place, it can well meet the need