`for`循环遍历标签在安企CMS中如何实现数据的多样式排版和展示？

网站内容运营中，如何让信息以更丰富、更吸引人的方式呈现，是提升用户体验和站点活跃度的关键。安企CMS（AnQiCMS）以其灵活的内容模型和强大的模板引擎，为我们提供了实现这一目标的利器。其中，for循环遍历标签正是我们进行多样式排版和展示时不可或缺的核心工具。

想象一下，你的网站不仅仅是静态地堆砌文章，而是能够根据不同场景，智能地呈现文章列表、产品图集、分类导航、用户评论甚至自定义参数。for循环标签在安企CMS中，就是实现这些动态展示的基石。

灵活驾驭数据，从基础列表开始

安企CMS的模板引擎采用了类似Django的语法，这使得内容开发者可以非常直观地操作数据。当我们谈到for循环，最直接的应用就是遍历一组数据，将其逐一展示出来。

例如，要在一个页面上展示最新的文章列表，我们可以利用archiveList标签获取数据集合，然后配合for循环将每篇文章的标题、链接、简介和缩略图等信息一一呈现。

{% archiveList articles with type="list" limit="5" %}
    <div class="latest-articles">
        {% for article in articles %}
            <div class="article-item">
                {% if article.Thumb %}<img src="{{ article.Thumb }}" alt="{{ article.Title }}" class="article-thumb">{% endif %}
                <h3 class="article-title"><a href="{{ article.Link }}">{{ article.Title }}</a></h3>
                <p class="article-description">{{ article.Description }}</p>
                <span class="article-date">发布时间：{{ stampToDate(article.CreatedTime, "2006-01-02") }}</span>
            </div>
        {% endfor %}
    </div>
{% endarchiveList %}

在这段代码中，articles是一个包含了多篇文章信息的集合，for循环逐一取出其中的article对象，我们就可以通过article.Title、article.Link等属性来访问并排版每篇文章的详细数据。这种方式让我们的内容展示变得轻而易举，无论是简单的文字列表，还是图文并茂的卡片式布局，都能轻松实现。

构建层次结构，打造智能导航和内容聚合

网站的导航和分类是用户发现内容的重要途径。安企CMS的categoryList标签结合for循环，能帮助我们构建多层级的分类导航，甚至是在分类下直接展示其相关内容。

假设我们需要展示产品分类，并且每个分类下可能还有子分类，我们可以这样灵活处理：

{% categoryList mainCategories with moduleId="2" parentId="0" %}
    <ul class="main-category-nav">
    {% for category in mainCategories %}
        <li>
            <a href="{{ category.Link }}">{{ category.Title }}</a>
            {% if category.HasChildren %}
                {# 如果有子分类，则再次循环展示 #}
                {% categoryList subCategories with parentId=category.Id %}
                    <ul class="sub-category-nav">
                    {% for subCategory in subCategories %}
                        <li><a href="{{ subCategory.Link }}">{{ subCategory.Title }}</a></li>
                    {% endfor %}
                    </ul>
                {% endcategoryList %}
            {% endif %}
        </li>
    {% endfor %}
    </ul>
{% endcategoryList %}

通过这种嵌套的for循环结构，我们不仅能清晰地展示网站的分类层级，还能在需要时，根据item.HasChildren这样的条件判断，决定是否进一步加载和显示子分类，或者直接在分类旁展示该分类下的部分文档，从而构建出更加智能和互动的内容聚合区域。

细节决定体验：循环中的个性化处理

for循环的强大之处远不止于此，它还内置了许多辅助变量和功能，帮助我们对循环中的每一个元素进行更精细的控制，从而实现多样的排版和展示效果。

  • forloop.Counter和forloop.Revcounter：这两个变量可以分别获取当前循环的索引（从1开始）和剩余元素的数量。我们可以利用它们为列表中的第一个元素添加特殊样式，或者实现隔行变色等效果。

    {% archiveList articles with type="list" limit="5" %}
    <div class="article-list-with-numbers">
    {% for article in articles %}
        <div class="article-item {% if forloop.Counter == 1 %}is-highlighted{% endif %}">
            <span class="item-number">{{ forloop.Counter }}.</span>
            <a href="{{ article.Link }}">{{ article.Title }}</a>
        </div>
    {% endfor %}
    </div>
{% endarchiveList %}

  • empty标签：当数据集合为空时，我们可能不希望页面出现空白，而是显示一条友好的提示信息。empty标签就能优雅地处理这种情况。

    {% archiveList emptyArticles with type="list" categoryId="999" %} {# 假设此分类下无文章 #}
    {% for article in emptyArticles %}
        ...
    {% empty %}
        <p class="no-content-tip">很抱歉，当前分类暂无文章内容。</p>
    {% endfor %}
{% endarchiveList %}

  • if条件判断：在循环内部，我们经常需要根据数据的某些属性来决定如何展示。比如，只有文章有缩略图时才显示图片，或者根据产品状态显示不同按钮。 “`twig {% archiveList products with type=“list” limit=“4” %}

    <div class="product-cards">
{% for product in products %}
    <div class="product-card">
        {%