如何在 AnQiCMS 模板中动态定义和使用小型数组变量进行循环?

📅 👁️ 57

在 AnQiCMS 的模板开发中,我们常常需要根据业务逻辑,灵活地展示一些小型的数据集合。这些集合可能是一些自定义的标签、导航项,或者仅仅是一些状态标识。虽然 AnQiCMS 提供了丰富的标签来调用后台数据,但有时我们希望直接在模板中定义一个小型数组,并对其进行循环处理,以实现更精细的控制和更简洁的模板代码。

AnQiCMS 的模板引擎语法类似于 Django,提供了直观且功能强大的方式来操作数据。对于在模板中定义和使用小型数组进行循环,主要会用到变量赋值标签 set 和一个非常有用的 list 过滤器,结合 for 循环标签,就能轻松实现这个需求。

理解 AnQiCMS 模板中的变量与循环机制

AnQiCMS 模板中的变量通过双花括号 {{ 变量名 }} 来输出,而控制结构,例如条件判断和循环,则使用单花括号加百分号 {% 标签 %} 的形式。当我们谈及循环,通常是指 {% for item in collection %} ... {% endfor %} 这样的结构,它会遍历 collection 这个集合中的每一个元素,并在循环体内以 item 变量来访问它们。

这里的关键在于如何生成这个“collection”(集合)。在大多数情况下,collection 可能来自于后台传入的文档列表、分类列表等。但如果我们想在模板中即时创建一个简单的数组,以便进行循环,就需要一些额外的技巧。

动态定义小型数组变量:set 标签与 list 过滤器

AnQiCMS 模板引擎允许我们使用 set 标签在模板中定义变量。它的基本语法是 {% set 变量名 = 值 %}。这个值可以是任何表达式的结果。

而要定义一个数组,我们可以巧妙地利用 list 过滤器。list 过滤器可以将一个符合 JSON 数组格式的字符串转换成模板引擎可识别的数组类型。结合 set 标签,我们就可以在模板中动态定义小型数组了。

例如,如果您想定义一个包含几个导航名称的数组,可以这样做:

{% set myNavItems = '["首页", "产品展示", "新闻中心", "联系我们"]'|list %}

在这行代码中:

  • {% set myNavItems = ... %}:我们声明了一个名为 myNavItems 的变量。
  • '["首页", "产品展示", "新闻中心", "联系我们"]':这是一个普通的字符串,但其内容符合 JSON 数组的格式,即使用方括号 [] 包裹,元素之间用逗号 , 分隔,字符串元素用双引号 "" 包裹。
  • |list:这是 list 过滤器,它会将前面这个 JSON 格式的字符串解析成一个真正的数组对象,并赋值给 myNavItems

这样,myNavItems 就成为了一个可以在后续模板中使用的数组变量。

不仅是简单的字符串数组,您也可以定义包含复杂数据结构(例如对象)的数组,只要它们符合 JSON 格式:

{% set productTypes = '[{"name": "电子产品", "code": "digital"}, {"name": "家居用品", "code": "home"}, {"name": "图书音像", "code": "books"}]'|list %}

现在,productTypes 变量就包含了一个由三个对象组成的数组,每个对象都有 namecode 属性。

将数组变量应用于循环:实用场景与技巧

一旦我们定义了小型数组变量,就可以将其应用于 for 循环,实现各种灵活的展示需求。

场景一:生成自定义导航菜单或筛选按钮

假设您想在侧边栏显示几个固定的链接,并希望当前页面对应的链接高亮显示。

{% set navItems = '[{"text": "首页", "path": "/"}, {"text": "关于我们", "path": "/about"}, {"text": "联系方式", "path": "/contact"}]'|list %}

<nav class="sidebar-nav">
    <ul>
    {% for item in navItems %}
        <li {% if url.Path == item.path %}class="active"{% endif %}>
            <a href="{{ item.path }}">{{ item.text }}</a>
        </li>
    {% endfor %}
    </ul>
</nav>

在这个例子中,url.Path 是一个全局变量,代表当前页面的 URL 路径。通过比较 item.pathurl.Path,我们可以轻松地为当前页面对应的导航项添加 active 类,实现高亮效果。

场景二:动态生成状态标签或标记

您可能需要为某个内容显示一系列状态或标记,例如在文章详情页为文章添加标签云,或者在产品列表页为产品添加属性标签。

{% set articleTags = '["网站优化", "内容营销", "SEO", "用户体验"]'|list %}

<div class="article-tags">
    <span>相关标签:</span>
    {% for tag in articleTags %}
        <a href="/tag/{{ tag }}" class="tag-badge tag-{{ forloop.Counter }}">{{ tag }}</a>
    {% endfor %}
</div>

这里我们利用了 forloop.Counter 这个内置变量,它代表当前循环的次数(从 1 开始)。通过将其添加到 CSS 类名中,可以实现基于索引的差异化样式,例如 tag-1tag-2 等。for 循环还提供了 forloop.Revcounter (倒数计数) 等更多控制循环行为的内置变量,让模板逻辑更加灵活。

通过这种方式,我们可以避免在后台创建大量不必要的数据,或者避免在多个模板文件中重复编写 HTML 结构,从而使模板代码更加简洁、可维护。

总结

在 AnQiCMS 模板中,动态定义和使用小型数组变量进行循环是一个非常实用的技巧。通过结合 set 标签进行变量赋值和 list 过滤器将 JSON 格式字符串转换为数组,我们可以创建任意复杂的临时数据集合。随后,利用 for 循环标签及其内置变量,能够轻松地遍历这些数组,实现灵活多样的页面展示效果。这种方法不仅提升了模板的灵活性和可维护性,也让开发者能更高效地完成内容布局和交互设计。


常见问题 (FAQ)

  1. 问:list 过滤器只能处理字符串吗?如果我的数组元素是数字或布尔值怎么办? 答:是的,list 过滤器期望接收一个字符串作为输入。但这个字符串的内容只要符合 JSON 数组的格式,就可以包含各种数据类型,例如数字、布尔值甚至是嵌套的对象。例如 {% set mixedArray = '[1, "text", true, {"key": "value"}]'|list %} 都是完全支持的。

2

相关文章

AnQiCMS 模板如何自动将文本中的换行符转换为 HTML 的 `<p>` 或 `<br>` 标签?

在网站内容呈现中,文本的格式化往往是决定用户阅读体验的关键。我们经常会遇到这样的需求:从后台数据库中获取的文本内容,通常只包含简单的换行符(`\n`),如果直接将其显示在网页上,浏览器并不会智能地将这些换行符转换为我们期望的HTML段落(`<p>`)或换行(`<br>`)标签,导致内容挤在一起,失去原有的结构和可读性。 安企CMS(AnQiCMS)在模板设计上充分考虑了这一点

2025-11-08

怎样在 AnQiCMS 模板中获取字符串、数组或键值对的元素总长度?

在安企CMS的模板设计中,动态获取字符串、数组或键值对的元素总长度是一项非常实用的功能,它能帮助我们在页面上灵活地展示信息,比如显示商品数量、评论条数,或者根据内容长度调整布局。安企CMS的模板引擎提供了简洁高效的过滤器来实现这些需求。 ### 核心利器:`length` 过滤器 要获取任何字符串、数组(slice)或键值对(map/struct)的元素总长度,最直接、最通用的方法是使用

2025-11-08

如何将 AnQiCMS 模板中的标签数组拼接成一个带有自定义分隔符的字符串?

在 AnQiCMS 的模板开发中,我们常常需要将从数据库中获取到的一组数据,比如文章的多个标签(Tags),以一种用户友好的方式展示出来,而不是简单地罗列。最常见的需求之一,就是将这些标签拼接成一个带有自定义分隔符的字符串,例如“标签A, 标签B, 标签C”或者“标签A | 标签B | 标签C”。AnQiCMS 强大的模板引擎提供了灵活的方式来实现这一目标。 ### 理解 AnQiCMS

2025-11-08

AnQiCMS 模板中,如何将字符串类型的数字转换为实际的 `integer` 或 `float` 类型?

在安企CMS模板中进行内容展示和逻辑判断时,我们经常会遇到需要对数字进行操作的情况。然而,从数据库或内容模型中获取的数据,即使在后台看起来是数字,在模板层面有时会以字符串(`string`)的形式传递过来。这时,如果直接进行算术运算或数值比较,可能会得到意想不到的结果。理解并掌握如何在模板中将这些字符串类型的数字转换为实际的 `integer`(整数)或 `float`(浮点数)

2025-11-08

AnQiCMS 如何将类似“PONGO2”的字母组合转换为电话数字键盘对应的数字?

## AnQiCMS 如何轻松将字母组合转化为电话数字键盘数字? 在日常生活中,我们有时会遇到一些由字母和数字混合组成的电话号码,例如某些公司为了品牌宣传,可能会使用如“999-PONGO2”这样的易记号码。然而,在实际拨打电话时,这些字母需要被转换成电话数字键盘上对应的数字。对于网站运营者而言,如果能在网站前端自动完成这种转换,无疑会大大提升用户体验。 AnQiCMS 作为一款高效

2025-11-08

怎样根据数量值在 AnQiCMS 模板中显示单词的单数或复数形式?

在构建网站时,我们经常会遇到需要根据某个数量值来动态显示文本的情况。例如,当有“1 条评论”时,我们希望显示为单数形式;而当有“2 条评论”时,则显示为复数形式。这种细节的处理不仅能提升用户体验,也展现了网站内容的专业性。如果手动判断数量并编写 if/else 逻辑,会使模板代码变得冗长且难以维护。 AnQiCMS 为模板开发者提供了一个非常实用的内置过滤器——`pluralize`

2025-11-08

如何在 AnQiCMS 模板中安全地移除 HTML 内容中的所有或部分指定标签?

在使用 AnQiCMS 构建网站时,我们经常需要对页面上展示的内容进行精细控制。特别是在处理用户提交的内容、从不同来源导入的文章或者仅仅是为了保持页面风格一致性时,可能会遇到 HTML 标签的困扰。这些标签可能包含不必要的格式、样式,甚至潜在的安全风险。幸运的是,AnQiCMS 模板系统提供了灵活的机制,帮助我们安全、高效地移除 HTML 内容中的所有或部分指定标签。 ### 为什么需要移除

2025-11-08

如何确保AnQiCMS多站点内容能够在前端统一展示和管理?

在当今复杂的数字环境中,许多企业和内容创作者往往需要管理多个网站,无论是拥有多个品牌子站点、不同产品线门户,还是为多语言用户提供服务。如何在确保每个站点独立运营的同时,又能实现内容在前端的统一展示和高效管理,成为了一个普遍的挑战。AnQiCMS作为一个企业级内容管理系统,在这方面提供了强大而灵活的解决方案。 ### AnQiCMS多站点能力基石

2025-11-08