模板开发进阶：在 AnQiCMS 模板中灵活定义与展示数组内容

在 AnQiCMS 的模板开发过程中，我们经常会遇到需要在前端页面中处理列表数据、动态配置选项或者需要根据特定逻辑生成一系列内容的场景。虽然大部分数据会通过标签从后端获取，但在某些情况下，直接在模板中定义和操作简单的数据集合，尤其是数组，能够极大地提高前端开发的灵活性和效率，减少对后端数据的依赖。AnQiCMS 强大的模板引擎提供了多种过滤器，让您能够轻松地在模板中定义数组并展示其内容。

认识 AnQiCMS 模板中的过滤器与变量定义

AnQiCMS 的模板系统基于类 Django 语法，其核心在于通过双花括号 {{ 变量 }} 来输出数据，以及通过 {% 标签 %} 来实现逻辑控制。过滤器（Filters）是模板语言中处理变量输出的重要工具，它们通过管道符号 | 应用于变量，对数据进行转换或处理。同时，{% set %} 标签允许我们在模板内部定义变量，这为我们定义数组提供了基础。

在模板中定义数组：两种常用过滤器

要在 AnQiCMS 模板中定义数组，主要可以利用 list 过滤器和 split 过滤器。它们各自适用于不同的场景。

1. 使用 list 过滤器从 JSON 字符串定义数组

list 过滤器可以将一个符合 JSON 数组格式的字符串转换为模板可迭代的数组（在底层通常是字符串切片 []string{}）。这种方式适合定义结构化、固定或预设的数组内容。

使用方法：

您需要将数组内容以 JSON 字符串的形式提供给 list 过滤器。例如，如果您想定义一个包含几种颜色的数组：

{% set colors = '["red", "green", "blue", "yellow"]'|list %}

在这里，'["red", "green", "blue", "yellow"]' 是一个标准的 JSON 数组字符串。|list 过滤器将其解析并赋值给 colors 变量。即使数组中包含数字，它们也会被作为字符串类型处理。

2. 使用 split 过滤器从分隔符字符串定义数组

split 过滤器则用于将一个字符串按照指定的分隔符拆分成数组。这种方法对于处理后端提供的一些以特定字符（如逗号、竖线等）分隔的字符串数据，或者在模板中快速定义简短列表时非常方便。

使用方法：

您需要提供一个待拆分的字符串，并指定用于拆分的分隔符。

{% set fruits = "apple,banana,orange,grape"|split:"," %}

在这个例子中，字符串 "apple,banana,orange,grape" 会被 , 分隔符拆分成一个包含四个水果名称的数组，并赋值给 fruits 变量。如果您需要按空格拆分，则分隔符可以简单地指定为 " "。如果分隔符为空字符串 ""，它将按每个 UTF-8 字符（包括中文字符）拆分。

AnQiCMS 还提供了一个 make_list 过滤器，功能与 split 过滤器类似，但它会将字符串中的每个字符都拆分成数组的一个元素，对于处理中文字符串也非常友好。

{% set characters = "你好世界"|make_list %}

展示数组内容：for 循环与索引访问

一旦您在模板中定义了数组，就可以通过 for 循环来迭代并展示其内容。对于需要访问特定元素的场景，也可以通过索引直接访问。

1. 使用 for 循环遍历数组

for 循环是遍历数组最常用的方式。它允许您逐个访问数组中的每个元素，并在循环体内对每个元素进行处理。

使用方法：

<p>我喜欢的颜色有：</p>
<ul>
{% for color in colors %}
    <li>{{ color }}</li>
{% endfor %}
</ul>

在上面的例子中，colors 数组中的每个元素（”red”, “green” 等）都会依次赋值给 color 变量，并在 <li> 标签中显示。

for 循环还提供了一些内置变量，如 forloop.Counter 可以获取当前循环的索引（从1开始），forloop.Revcounter 可以获取当前循环剩余的次数。

<p>水果列表：</p>
<ol>
{% for fruit in fruits %}
    <li>第 {{ forloop.Counter }} 种水果：{{ fruit }}</li>
{% endfor %}
</ol>

处理空数组： 如果数组可能为空，您可以使用 {% empty %} 标签来定义当数组为空时显示的备用内容，以提升用户体验。

<p>今天的特价菜：</p>
<ul>
{% for dish in special_dishes %}
    <li>{{ dish }}</li>
{% empty %}
    <li>今日暂无特价菜。</li>
{% endfor %}
</ul>

2. 通过索引直接访问数组元素

如果您需要访问数组中的某个特定元素，而不是遍历整个数组，可以使用方括号 [] 加上索引号来直接访问。索引从 0 开始。

<p>我的第一个最爱颜色是：{{ colors[0] }}</p>
<p>我最不喜欢的颜色可能是：{{ colors[3] }}</p>

请注意，如果尝试访问超出数组范围的索引，模板引擎可能会报错或返回空值，因此在生产环境中，建议在使用前进行必要的判断。

实际应用场景举例

  • 动态生成导航菜单或筛选条件： 您可以在模板中定义一个包含导航名称和链接的数组，然后通过 for 循环动态生成菜单项，避免在后台频繁创建单个导航。
  • 切换主题样式或图标： 定义一个包含 CSS 类名或图标路径的数组，通过 for 循环结合 {% cycle %} 标签，实现元素的交替样式，例如表格行的斑马纹效果。
  • 配置简单的表单选项： 对于一些不常变动的下拉菜单或单选框选项，可以直接在模板中定义数组，然后生成相应的 option 或 input 元素。

结合其他过滤器：数组的更多操作

一旦数组被定义，您还可以将其与 AnQiCMS 提供的其他过滤器结合使用，实现更复杂的数据处理：

  • join 过滤器： 将数组元素连接成字符串。 
    
{% set tags = "AnQiCMS,GoLang,CMS"|split:"," %}
<p>文章标签：{{ tags|join:" | " }}</p> {# 输出: AnQiCMS | GoLang | CMS #}
  • contain 过滤器： 检查数组是否包含特定元素。 
    
{% set user_roles = '["admin", "editor"]'|list %}
{% if user_roles|contain:"admin" %}
    <p>您是管理员。</p>
{% endif %}
  • slice 过滤器： 截取数组的子集。 
    
{% set all_items = "item1,item2,item3,item4,item5"|split:"," %}
{% set first_three = all_items|slice:":3" %} {# 获取前三个元素 #}
{% for item in first_three %}
    <span>{{ item }}</span>
{% endfor %}

总结

通过 list 和 split 等过滤器在 AnQiCMS 模板中定义数组，并结合 for 循环和索引访问来展示其内容，能够为前端开发带来极大的便利。这种方式不仅可以处理简单的列表数据，还能在不增加后端负担的情况下，实现模板内部的灵活配置和动态内容生成。掌握这些技巧，将使您的 AnQiCMS 模板开发更加高效和强大。

常见问题 (FAQ)

Q1: list 或 split 过滤器是否支持定义包含不同类型数据的数组，比如同时包含数字和字符串？ A1: list 和 split 过滤器在 AnQiCMS 模板中主要用于创建 `