如何在模板中循环遍历列表数据并显示（for循环），支持计数和翻转？

在安企CMS模板中，高效地展示列表数据是网站内容运营不可或缺的一部分。无论是展示最新文章、产品列表、分类目录，还是自定义的数据集合，灵活地循环遍历这些数据并进行精细化控制，都能极大地提升网站的表现力和用户体验。安企CMS提供了强大且易于上手的模板引擎，其for循环标签功能丰富，不仅支持基本的遍历，还能轻松实现计数、翻转以及更多高级操作。

核心概念：for 循环的基础用法

在安企CMS模板中，for循环的语法与Django模板引擎非常相似，让熟悉这类语法的用户能够迅速上手。它的基本结构是{% for item in collection %}...{% endfor %}。这里的collection代表您想要遍历的数据集合（例如，通过archiveList、categoryList等标签获取到的数据），而item则是在每次循环中代表当前数据项的临时变量。

例如，如果您想展示最近发布的几篇文章列表，通常会使用archiveList标签获取数据，然后通过for循环进行遍历：

{% archiveList articles with type="list" limit="5" %}
    {% for article in articles %}
        <div class="article-item">
            <h3><a href="{{ article.Link }}">{{ article.Title }}</a></h3>
            <p>{{ article.Description }}</p>
            <span>发布日期: {{ stampToDate(article.CreatedTime, "2006-01-02") }}</span>
        </div>
    {% endfor %}
{% endarchiveList %}

在这个例子中，articles是我们通过archiveList获取到的文章集合，article则是在每次循环中代表当前文章对象的变量。您可以根据自己的喜好，将article替换为任何易于理解的变量名，只要保持for语句内部使用该变量即可。

循环中的实用工具：计数与状态

在循环遍历数据时，我们常常需要知道当前是第几次循环，或者还剩下多少项。安企CMS的for循环提供了内置的变量forloop，它包含了当前循环状态的详细信息，其中最常用的是forloop.Counter和forloop.Revcounter。

• forloop.Counter: 这个变量会从1开始，随着每次循环递增，表示当前是第几项。这在需要为列表项添加序号、排名或对第一项、最后一项进行特殊处理时非常有用。
• forloop.Revcounter: 与Counter相反，Revcounter从列表的总项数开始递减，表示当前项距离列表末尾还有多少项（包括当前项）。例如，如果列表中有5项，Revcounter在第一次循环时是5，第二次是4，依此类推，直到最后一项是1。

结合if逻辑判断标签，您可以轻松实现各种条件显示效果。例如，给列表中的第一项添加一个特殊的样式：

{% archiveList articles with type="list" limit="5" %}
    {% for article in articles %}
        <div class="article-item {% if forloop.Counter == 1 %}is-first{% endif %}">
            <h3><a href="{{ article.Link }}">{{ article.Title }}</a></h3>
            <p>这是第 {{ forloop.Counter }} 篇文章，还剩下 {{ forloop.Revcounter - 1 }} 篇。</p>
        </div>
    {% endfor %}
{% endarchiveList %}

通过forloop.Counter，您可以清楚地知道当前循环的进度，并据此灵活地调整内容的呈现。

灵活控制顺序：翻转与排序

有时候，我们可能需要以不同的顺序来展示列表数据，比如倒序显示最新内容，或者按某个属性进行排序。安企CMS的for循环也对此提供了简洁的修饰符：reversed和sorted。

• reversed: 这个修饰符会简单地将数据集合以相反的顺序进行遍历。如果您从数据库中获取的数据是按时间降序排列的，但您希望在模板中以升序显示，就可以使用reversed。
• sorted: 这个修饰符会对数据集合进行默认的排序（通常是按元素的自然顺序，如数字大小或字母顺序）。请注意，sorted通常用于对简单的集合进行排序。
• 组合使用：reversed sorted：您可以将这两个修饰符组合使用。在这种情况下，列表会首先被排序，然后再进行翻转。

以下是使用reversed来倒序显示文章列表的示例：

{% archiveList articles with type="list" limit="5" %}
    {% for article in articles reversed %} {# 这里添加 reversed 翻转顺序 #}
        <div class="article-item">
            <h3><a href="{{ article.Link }}">{{ article.Title }}</a></h3>
            <p>（倒序显示）发布日期: {{ stampToDate(article.CreatedTime, "2006-01-02") }}</p>
        </div>
    {% endfor %}
{% endarchiveList %}

需要注意的是，sorted修饰符在处理复杂对象集合时，其默认排序行为可能不是您所期望的。对于更复杂的排序需求，您可能需要在后端查询数据时就指定好排序方式，或者在for循环之外进行数据预处理。

处理空列表：empty 标签

当您尝试遍历一个可能为空的列表时，通常会担心页面上出现空白区域或错误。安企CMS的for循环提供了一个empty标签，用于在集合为空时显示备用内容，避免了额外的if判断，使模板代码更加简洁：

{% archiveList articles with type="list" categoryId="999" %} {# 假设分类ID 999下没有文章 #}
    {% for article in articles %}
        <div class="article-item">
            <h3><a href="{{ article.Link }}">{{ article.Title }}</a></h3>
        </div>
    {% empty %} {# 当 articles 集合为空时，显示以下内容 #}
        <p class="no-content">当前分类下暂无文章，敬请期待！</p>
    {% endfor %}
{% endarchiveList %}

这样，即使某个分类下暂时没有内容，您的网站也能友好地提示访问者，而不是显示空白。

高级技巧：整洁的输出与嵌套循环

移除逻辑标签的空行

在模板渲染过程中，for循环或if判断等逻辑标签可能会在最终的HTML输出中产生不必要的空行，影响HTML代码的整洁度。安企CMS提供了一个小技巧来解决这个问题：在标签的开头或结尾添加一个连字符-。

• {%- for ... %}: 移除标签前面的空白。
• {% endfor -%}: 移除标签后面的空白。

这个小小的改动可以让生成的HTML源码更加紧凑：

<ul>
{%- archiveList articles with type="list" limit="3" %}
    {%- for article in articles %}
    <li>
        <a href="{{ article.Link }}">{{ article.Title }}</a>
    </li>
    {%- endfor %}
{%- endarchiveList %}
</ul>

嵌套循环

对于多级数据结构，比如分类（一级列表）下包含文章（二级列表），您可以使用嵌套的for循环来展示。安企CMS的categoryList和archiveList标签配合使用就能实现这种效果：

”`twig {% categoryList categories with moduleId=“1” parentId=“0” %}

{% for category in categories %}
    <div class="category-section">
        <h2><a href="{{ category.Link }}">{{ category.Title }}</a></h2>
        <ul>
            {% archiveList articles with type="list" categoryId=category.Id limit