驾驭 AnQiCMS 模板：使用 for 循环遍历数据列表的艺术

各位AnQiCMS的运营伙伴们，大家好！

在日常的网站内容运营中，我们经常需要展示一系列数据，无论是最新文章列表、产品分类导航，还是评论详情，都离不开对数据集合的遍历和展示。AnQiCMS作为一款高效、灵活的内容管理系统，深知模板在内容呈现中的重要性。今天，我们就来深入探讨AnQiCMS模板引擎中一个核心且功能强大的标签——for循环，看看如何利用它轻松驾驭各种数据列表，让您的网站内容焕发活力。

AnQiCMS的模板引擎采用了类似Django的语法风格，这使得有其他Web开发经验的伙伴们上手会非常快，即使是新手，其直观性也能让您迅速掌握。for循环是构建动态内容展示的基础，它能帮助我们将后台获取的数据，以结构化、可定制的方式呈现在前端页面上。

for循环的核心用法：遍历数据集合

想象一下，你从后台获取了一组文章数据，现在需要将这些文章逐一显示在网页上。这时，for循环就派上了用场。其最基本的语法结构非常简洁明了：

{% for item in collection %}
    {# 在这里放置你希望对每个“item”进行的操作和显示逻辑 #}
{% endfor %}

在这里，collection代表的是您希望遍历的数据集合，例如AnQiCMS的archiveList（文章列表）、categoryList（分类列表）等标签获取的数据。而item则是一个临时变量，在每一次循环中，它会依次代表collection中的一个数据项。通过访问item的不同属性（例如item.Title获取标题，item.Link获取链接），我们就能展示每个数据项的详细信息。

让我们通过几个常见的数据列表来具体看看for循环的魅力。

示例一：动态展示文章列表

文章列表是网站最常见的内容形式之一。假设我们使用archiveList标签获取了最新的文章：

{% archiveList articles with type="list" limit="10" %}
    <div class="article-list">
    {% for article in articles %}
        <article class="article-item">
            <a href="{{ article.Link }}" title="{{ article.Title }}">
                <h3>{{ article.Title }}</h3>
                <p>{{ article.Description }}</p>
                <div class="meta-info">
                    <span>发布时间：{{ stampToDate(article.CreatedTime, "2006年01月02日") }}</span>
                    <span>阅读量：{{ article.Views }}</span>
                </div>
            </a>
        </article>
    {% endfor %}
    </div>
{% endarchiveList %}

在这个例子中，我们首先通过archiveList标签将数据存储到articles变量中，并限定只显示10条列表数据。接着，{% for article in articles %}会逐一遍历这10篇文章。在循环体内，article.Link、article.Title、article.Description和article.Views等属性会分别展示文章的链接、标题、简介和浏览量。特别地，对于时间戳字段CreatedTime，我们借助了AnQiCMS内置的stampToDate函数进行格式化，使其以更友好的”2006年01月02日”形式呈现。

值得一提的是，如果articles这个集合是空的，我们不希望页面上出现空白，而是能给用户一个友好的提示。AnQiCMS的for循环提供了一个empty块来优雅地处理这种情况：

{% archiveList articles with type="list" limit="10" %}
    <div class="article-list">
    {% for article in articles %}
        <article class="article-item">
            <a href="{{ article.Link }}" title="{{ article.Title }}">
                <h3>{{ article.Title }}</h3>
                <p>{{ article.Description }}</p>
            </a>
        </article>
    {% empty %}
        <p>抱歉，目前还没有任何文章发布。</p>
    {% endfor %}
    </div>
{% endarchiveList %}

当articles为空时，{% empty %}内的内容就会被渲染出来，为用户提供更好的体验。

示例二：构建多级分类导航

网站导航通常需要展示分类，甚至子分类。for循环同样能胜任这种嵌套的遍历需求。

<nav class="main-nav">
    <ul>
    {% navList mainMenu with typeId=1 %} {# 获取ID为1的主导航数据 #}
        {% for mainItem in mainMenu %}
            <li {% if mainItem.IsCurrent %}class="active"{% endif %}>
                <a href="{{ mainItem.Link }}">{{ mainItem.Title }}</a>
                {% if mainItem.NavList %} {# 如果有子导航，则进行嵌套循环 #}
                    <ul class="sub-nav">
                    {% for subItem in mainItem.NavList %}
                        <li {% if subItem.IsCurrent %}class="active"{% endif %}>
                            <a href="{{ subItem.Link }}">{{ subItem.Title }}</a>
                        </li>
                    {% endfor %}
                    </ul>
                {% endif %}
            </li>
        {% endfor %}
    {% endnavList %}
    </ul>
</nav>

这里，我们首先通过navList获取主导航数据到mainMenu变量。外层for循环遍历主导航项，并通过mainItem.NavList判断是否存在子导航。如果存在，则在内层再次使用for循环遍历子导航项。mainItem.IsCurrent和subItem.IsCurrent这样的属性，可以帮助我们判断当前导航项是否被选中，从而添加active样式，提升用户体验。

示例三：展示自定义文档参数

在AnQiCMS中，您为文章或产品模型自定义的各种参数，如“作者”、“来源”、“产品型号”等，也可以通过for循环统一展示。

<div class="product-specs">
    <h4>产品参数</h4>
    {% archiveParams specs with id=archive.Id %} {# 获取当前文档的所有自定义参数 #}
        <ul>
        {% for param in specs %}
            <li>
                <span>{{ param.Name }}：</span>
                <span>{{ param.Value | safe }}</span> {# 注意：如果param.Value可能包含HTML，请使用|safe过滤器 #}
            </li>
        {% endfor %}
        </ul>
    {% endarchiveParams %}
</div>

这里，archiveParams标签会获取当前文章（archive.Id）的所有自定义参数，并将其存入specs数组。循环遍历specs，可以方便地展示每个参数的Name（参数名称）和Value（参数值）。这里特别提醒，如果param.Value可能包含富文本或HTML代码，务必使用|safe过滤器，以确保HTML内容能够正确解析并显示，而不是被转义成纯文本。

提升for循环体验的进阶技巧

除了基本的遍历，AnQiCMS的for循环还提供了一些强大的辅助功能，让您的模板更具表现力。

1. 利用forloop变量获取循环信息

在for循环内部，AnQiCMS会自动提供一个特殊的forloop变量，其中包含了一些有用的循环信息：

  • forloop.Counter: 当前循环的序号，从1开始计数。
  • forloop.Revcounter: 当前循环的倒序序号，从总数开始倒数。

这在需要为列表中的第一个、最后一个或奇偶项添加特殊样式时非常有用：

{% archiveList articles with type="list" limit="10" %}
    <div class="article-list">
    {% for article in articles %}
        <article class="article-item {% if forloop.Counter == 1 %}first-article{% endif %} {% if forloop.Counter is odd %}odd{% else %}even{% endif %}">
            <h3>{{ article.Title }} (第{{ forloop.Counter }}篇，还剩{{ forloop.Revcounter }}篇)</h3>
        </article>
    {% endfor %}
    </div>
{% endarchiveList %}

通过forloop.Counter == 1我们可以轻松识别并样式化第一篇文章，而forloop.Counter is odd则可以用于实现列表项的斑马线效果。

2. 运用reversed和sorted修饰符

有时我们希望数据以特定的顺序展示。for循环支持reversed（反向）和sorted（排序）修饰符：

  • {% for item in collection reversed %}: 将数据集合反向遍历。
  • {% for item in collection sorted %}: 对数据集合进行排序后再遍历（默认为升序）。

您甚至可以组合使用它们：{% for item in collection reversed sorted %}。这在需要以不同顺序展示同一批数据时非常灵活。

3. 使用cycle标签实现样式轮换

cycle标签是一个非常巧妙的工具，它可以在循环中按顺序输出您定义的多个值。这在需要交替显示不同背景色、CSS类名或其他变量时非常实用：

”`twig {% archiveList articles with type=“list” limit=“10” %}

<ul class="styled-list">
{% for article in articles %}
    <li class="list-item {% cycle