AnQiCMS as an enterprise-level content management system developed in Go language, with its efficient and flexible features, provides strong support for content operators.In daily content operation and template creation, we often encounter the need to process and dynamically display data, such as adding numbers to list items, calculating totals, etc.Among them, template filters are an important tool for achieving such needs.addFilter, see if it can help us implement a simple dynamic display counter.

addFilter: the magician of numbers and strings

In AnQiCMS template syntax, we operate data through syntax similar to Django's template engine, which includes a rich set of filters.addThe filter is one of them, and its core function is as the name suggests: to perform an 'addition' operation.But this 'addition' is not limited to mathematical addition of numbers; it can also巧妙ly handle the concatenation of strings.

In particular, when you useaddthe filter:

  • If the operand is a number, it performs standard mathematical addition.
  • If the operand is a string, it concatenates the two.
  • Even smarter is that, even for mixed types (such as numbers and strings),addThe filter also attempts to perform reasonable conversions.If a number can be converted to a string and concatenated, it will do so; if a string can be converted to a number and added, it will also try.If the conversion fails, incompatible parts will be ignored to ensure the stability of template rendering.

For example, you can use it like this in a template:{{ 5|add:2 }}it will output7.{{ "安企"|add:"CMS" }}it will output安企CMS.{{ 5|add:"CMS" }}it will output5CMS.

This flexibility allowsaddThe filter is very practical in many scenarios.

addHow does the filter help the simple counter display dynamically?

Back to our core issue:addCan the filter implement a simple counter dynamic display? The answer is affirmative, but when understanding the meaning of 'dynamic', we need to clarify the rendering mechanism of the AnQiCMS template.

The template of AnQiCMS is rendered on the server side.This means that when the user accesses the page, the system generates the complete HTML content based on the backend data and template logic, and then sends it to the browser.Therefore, the term 'dynamic' here refers to the ability to perform real-time calculations and display based on the current context (such as loop iteration, variable values) during the generation of HTML in the template, rather than to client-side dynamic effects that change in the user's browser after the page is loaded.

Here are several kindsaddFilters can help realize the dynamic display of simple counters in the following scenarios:

1. Adjusting and displaying the list number

When traversing an article list or product list, we often need to display a serial number for each item. The AnQiCMS'sforloop tag built-inforloop.CounterThis variable represents the current iteration count of the loop, starting from 1. If you need to start counting from a different number or just want to add an offset to the existing sequence,addThe filter can be used.

Assume you have a list of articles and you want the numbering to start from 101:

{% archiveList archives with type="list" limit="10" %}
    {% for item in archives %}
        <li>
            {# 显示从101开始的序号 #}
            <span>序号：{{ forloop.Counter|add:100 }}</span>
            <a href="{{item.Link}}">{{item.Title}}</a>
        </li>
    {% empty %}
        <li>没有文章内容</li>
    {% endfor %}
{% endarchiveList %}

In this example,forloop.Counterit will increase by 1 through|add:100We can make the displayed sequence start from 101, 102, 103 ..., achieving a simple dynamic increment display.

2. Adjustment and cumulative display of existing values

Sometimes, we might need to perform some simple calculations based on existing data (such as the number of page views of an article, the price of a product) and dynamically display the adjusted results. Although this is not strictly a 'counter', it demonstratesaddThe ability of the filter to perform dynamic numerical processing in the template.

For example, you may want to display an 'Estimated Reading Time' on the article detail page, which is equal to the actual page views plus a fixed value:

{% archiveDetail archive with name="Views" %}
    <p>实际浏览量：{{ archive.Views }}</p>
    {# 显示预估阅读量，在实际浏览量的基础上增加100 #}
    <p>预估阅读量：{{ archive.Views|add:100 }}</p>
{% endarchiveDetail %}

Or, would you like to display the base price of each product plus a fixed shipping fee in the list?

{% archiveList products with type="list" moduleId=2 limit="5" %}
    {% for item in products %}
        <li>
            <h3>{{item.Title}}</h3>
            {# 假设 item.Price 是产品的价格，固定运费是10 #}
            <p>总价（含运费）：{{ item.Price|add:10 }} 元</p>
        </li>
    {% endfor %}
{% endarchiveList %}

These examples illustrate:addThe filter can calculate based on the current variable value and 'dynamically' display the calculated result during template rendering, which is very convenient in many scenarios that require simple numerical adjustments.

Summary

addThe filter is a small but versatile tool in the AnQiCMS template.It can flexibly handle number addition and string concatenation, thus realizing various simple dynamic display effects during template rendering.addFilters can provide simple and efficient solutions. However, we need to remember that its 'dynamic' occurs during server-side template rendering, not in real-time client interaction.

Common Questions (FAQ)

Q1:addCan the filter implement dynamic counters like 'article view count real-time update'? A1:Cannot.addThe filter is executed when rendering templates on the server side, operating on the available data at that time and generating static HTML. To achieve dynamic effects like real-time updates of article views in the user's browser, it usually requires combining backend logic (updating the database with each request) and frontend JavaScript code (loading the page via AJAX and other methods)