如何使用循环(for标签)遍历并显示内容列表?

📅 👁️ 62

在安企CMS中,无论是展示文章列表、产品目录,还是导航菜单、友情链接,我们都会频繁地与内容列表打交道。要让这些内容动态地展现在网站前端,离不开强大的循环功能。今天,我们就来深入了解如何使用安企CMS模板中的循环(for标签)来遍历并显示您的内容列表。

for 标签的核心语法:让内容动起来

安企CMS的模板语法类似Django和Blade,非常直观。当您需要处理一组数据时,for标签是您的得力助手。它的基本结构非常简洁:

{% for item in collection %}
    {# 在这里显示每个item的详细信息 #}
{% endfor %}

在这里,collection 指的是您要遍历的内容集合,比如通过 archiveListcategoryList 标签获取到的文章列表或分类列表。item 则是在每次循环中代表集合中的当前元素,您可以访问 item 的各种属性来显示具体内容。

举个例子,假设您想展示最新的几篇文章标题和链接:

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

在这个例子中,latestArticles 是我们通过 archiveList 标签获取到的文章列表。在 for 循环中,article 变量在每一次迭代时代表列表中的一篇文章。我们可以通过 article.Link 访问文章链接,通过 article.Title 访问文章标题,并将其呈现在网页上。

遍历内容列表:以文档列表为例

文档列表是网站最常见的动态内容之一。通过 archiveList 标签,我们可以轻松获取到文章、产品等模型下的文档数据,然后用 for 循环来展现。

例如,您希望展示一个分类下的文档列表,包含标题、简介和发布时间:

{% archiveList documents with categoryId="1" type="list" limit="10" %}
    <div class="documents-section">
    {% for doc in documents %}
        <div class="document-item">
            <h3><a href="{{ doc.Link }}">{{ doc.Title }}</a></h3>
            <p>{{ doc.Description }}</p>
            <p class="meta">发布时间:{{ stampToDate(doc.CreatedTime, "2006-01-02") }}</p>
            {% if doc.Thumb %}
                <img src="{{ doc.Thumb }}" alt="{{ doc.Title }}" class="document-thumbnail">
            {% endif %}
        </div>
    {% endfor %}
    </div>
{% empty %}
    <p>当前分类下没有可用的文档。</p>
{% endarchiveList %}

这里,我们通过 archiveList 获取了分类ID为1的10篇文档。在 for doc in documents 循环中:

  • doc.Linkdoc.Title 分别提供了文档的链接和标题。
  • doc.Description 用于显示文档的简介。
  • doc.CreatedTime 是一个时间戳,我们配合 stampToDate 标签将其格式化为可读的日期。
  • doc.Thumb 则展示了文档的缩略图,并用 if 标签判断是否存在图片。

循环中的实用小技巧

为了让您的内容展示更加灵活和美观,安企CMS的 for 标签还提供了一些实用的辅助功能。

  1. 处理空列表:empty 标签 当您的内容集合可能为空时,empty 标签就能派上用场。如果 for 循环没有可遍历的 item,那么 empty 标签内的内容就会被显示,避免页面出现空白或错误。

    {% for item in someList %}
        {# 列表内容 #}
    {% empty %}
        <p>暂时没有相关内容可供显示。</p>
    {% endfor %}
    
  2. 获取循环序号:forloop.Counterforloop.Revcounter 在循环内部,forloop.Counter 可以获取当前循环的序号(从1开始),forloop.Revcounter 则获取当前循环距离结束的剩余项数。这在需要为特定项(如第一项或最后一项)应用不同样式时非常有用。

    {% for item in documents %}
        <div class="document-item {% if forloop.Counter == 1 %}first-item{% endif %}">
            <span class="item-number">{{ forloop.Counter }}.</span>
            <h3>{{ item.Title }}</h3>
        </div>
    {% endfor %}
    
  3. 调整遍历顺序:reversedsorted 有时您可能需要以不同的顺序显示内容。reversed 关键字可以让您倒序遍历集合,而 sorted 关键字可以对集合进行排序(适用于可排序类型)。

    {# 倒序显示文章 #}
    {% for article in latestArticles reversed %}
        ...
    {% endfor %}
    
    {# 排序显示文章(通常结合后台排序参数更常用) #}
    {% for article in latestArticles sorted %}
        ...
    {% endfor %}
    

    不过,在安企CMS中,通常我们通过 archiveList 等标签的 order 参数来指定排序方式,这样更为直接和高效。

  4. 间隔显示不同内容:cycle 标签 如果您想在循环中交替显示不同的值,例如为列表的奇偶行设置不同背景色,cycle 标签是理想选择。

    {% for item in documents %}
        <div class="document-item {% cycle "odd" "even" %}">
            {# ... 内容 ... #}
        </div>
    {% endfor %}
    

    这样,第一项会得到 odd 类,第二项得到 even 类,第三项又回到 odd,以此类推。

  5. 整洁代码:移除多余空行 为了保持生成HTML的简洁性,您可以利用 {%--} 来移除标签前后的多余空行。这对于循环中生成大量元素的场景尤其有用。

    {% for item in documents -%}
        <div class="document-item">
            {# ... 内容 ... #}
        </div>
    {%- endfor %}
    

嵌套循环:处理多级数据

在处理多级分类或复杂数据结构时,嵌套循环是必不可少的。例如,您可以先遍历顶级分类,然后在每个顶级分类内部,再遍历其子分类或属于该分类的文档。

{% categoryList mainCategories with moduleId="1" parentId="0" %}
    <nav class="main-nav">
    {% for mainCat in mainCategories %}
        <div class="main-category">
            <h4><a href="{{ mainCat.Link }}">{{ mainCat.Title }}</a></h4>
            {% if mainCat.HasChildren %}
                <ul class="sub-category-list">
                {% categoryList subCategories with parentId=mainCat.Id %}
                    {% for subCat in subCategories %}
                        <li><a href="{{ subCat.Link }}">{{ subCat.Title }}</a></li>
                    {% endfor %}
                {% endcategoryList %}
                </ul>
            {% endif %}
        </div>
    {% endfor %}
    </nav>
{% endcategoryList %}

这个例子展示了如何

相关文章

如何根据条件判断(if标签)动态显示不同的内容块?

在安企CMS中,网站内容的动态展示是提升用户体验和运营效率的关键。您可能常常遇到这样的需求:希望某个内容块只在特定条件下出现,或者针对不同情况显示不同的信息。这时,安企CMS强大的条件判断功能——`if`标签,就能派上大用场了。 安企CMS的模板系统采用了类似Django模板引擎的语法,让您能够以直观的方式在模板中实现逻辑判断。通过灵活运用`if`标签,您可以轻松控制页面元素的显示与隐藏

2025-11-08

如何在模板中显示后台自定义的横幅(Banner)图片列表?

网站的横幅(Banner)图片是吸引访客目光、展示核心信息的重要元素。在安企CMS中,您可以灵活地在后台自定义这些横幅图片,并将其优雅地呈现在网站的各个模板位置。下面,我们将详细探讨如何在模板中显示后台自定义的横幅图片列表,让您的网站更具吸引力。 ### 后台横幅图片的配置与管理 在安企CMS的后台,横幅图片的管理主要分为两种情况:全局首页横幅和特定内容横幅。 1.

2025-11-08

如何将图片地址转换为缩略图格式进行显示?

在网站运营中,图片扮演着至关重要的角色。它们不仅能吸引用户的目光,还能有效传达信息。然而,过大的图片会严重影响网站加载速度,进而损害用户体验和搜索引擎排名。因此,将图片地址转换为缩略图格式进行显示,成为了优化网站性能不可或缺的一环。AnQiCMS 在这方面提供了非常便捷的功能,它能自动为您的网站生成和管理图片缩略图,并提供灵活的调用方式,帮助您轻松应对图片优化挑战。 ### AnQiCMS

2025-11-08

如何截取长文本内容并在末尾添加省略号,以优化列表显示?

在网站运营中,尤其是管理内容丰富的平台,列表页的显示效果对用户体验至关重要。无论是文章列表、产品概览还是新闻动态,我们都希望页面整洁、信息一目了然。然而,当文档内容或描述过长时,直接显示在列表中往往会导致版面混乱,影响整体美观和信息获取效率。此时,有效地截取文本并添加省略号就显得尤为重要。 安企CMS(AnQiCMS)提供了强大而灵活的模板系统,其中内置的文本过滤器能帮助我们轻松解决这一问题

2025-11-08

如何将时间戳格式化为可读的日期时间字符串进行显示?

在安企CMS中将时间戳格式化为可读日期:一份实用的指南 在管理网站内容时,我们经常会遇到需要显示文章发布时间、更新时间、用户注册时间等信息。这些数据在数据库中通常以一串数字——也就是“时间戳”的形式存储。虽然计算机能轻松理解这些数字,但对于访问网站的用户来说,它们可就显得不那么友好了。比如,看到“1678886400”这样的数字,远不如“2023年3月15日 10:00:00”来得直观清晰

2025-11-08

如何定义模板变量并在内容显示中复用?

在安企CMS中管理和展示网站内容,灵活运用模板变量无疑是提升效率和保持网站一致性的关键。无论是需要统一调整全站信息,还是为特定内容定制独有属性,理解如何定义和复用模板变量,都能让内容运营变得更加得心应手。 ### 从后台源头定义变量 在安企CMS中,很多我们日常在网站上看到的信息,实际上都是通过后台预设的变量来管理的。这意味着您无需触碰一行代码,就能轻松定义和修改这些内容。 首先

2025-11-08

安企CMS如何管理和显示上传的图片及视频资源?

在使用安企CMS管理网站内容时,图片和视频资源无疑是丰富页面、提升用户体验的关键。安企CMS提供了一套直观而强大的功能,帮助我们高效地上传、管理并展示这些多媒体内容。 ### 一、资源的便捷上传与集中管理 当我们创建文章、产品或单页内容时,可以在内容编辑区直接插入图片和视频。这个过程非常流畅,就像日常使用文档编辑器一样。除了这种即时插入方式,安企CMS还设有一个专门的“图片资源管理”区域

2025-11-08

伪静态规则如何影响网站URL的显示形式和SEO友好性?

## 安企CMS伪静态规则:如何打造用户与搜索引擎都喜爱的URL结构 在网站运营中,网址(URL)不仅是用户访问页面的路径,更是搜索引擎理解和评价网站内容的重要线索。一个清晰、简洁且富有含义的URL,能极大地提升用户体验和网站的搜索引擎优化(SEO)表现。安企CMS深知这一点,因此提供了灵活多样的伪静态规则管理功能,帮助我们轻松打造理想的URL结构。 ### 什么是伪静态,为什么它如此重要

2025-11-08