如何在 AnQiCMS 模板中利用 Django 风格的标签和变量动态展示数据?

安企BLOG 2025-11-07 0 阅读
如何在 AnQiCMS 模板中利用 Django 风格的标签和变量动态展示数据?

AnQiCMS 提供了一套灵活且功能强大的模板系统,它采用了类似 Django 模板引擎的语法风格,这使得有经验的开发者能够快速上手,同时也非常直观,即便是不熟悉模板语言的用户也能通过简单的学习来动态呈现网站内容。这套系统以其简洁的标签和变量使用方式,让数据与前端页面的交互变得高效且易于管理。

要充分利用 AnQiCMS 模板来动态展示数据,我们需要理解其核心的语法结构:变量、标签和过滤器。

理解变量:直接输出数据的途径

在 AnQiCMS 模板中,变量是您将后端数据直接输出到前端页面的主要方式。它们通常使用双花括号 {{ 变量名 }} 来定义。当页面被请求时,AnQiCMS 会解析这些变量,并将其替换为对应的实际数据。例如,如果您想显示一篇文章的标题,可以直接使用 {{ archive.Title }}

值得注意的是,变量名通常遵循驼峰命名法则,即每个单词的首字母大写,比如 archive.Id 代表文章的 ID,archive.CreatedTime 代表文章的创建时间。这种命名规范使得变量的含义一目了然。

运用标签:实现逻辑控制和数据获取

标签是 AnQiCMS 模板系统中实现逻辑控制和执行特定功能的核心。它们以单花括号和百分号 {% 标签名 %} 的形式出现,并且大多数标签都需要一个对应的结束标签,如 {% if ... %}{% endif %}{% for ... %}{% endfor %}

  1. 数据获取标签 AnQiCMS 内置了多种数据获取标签,让您能够轻松地从数据库中提取所需信息。

    • archiveDetailarchiveList:用于获取单篇文章详情或多篇文章列表。例如,{% archiveDetail with name="Title" %} 可以获取当前页面的文章标题,而 {% archiveList archives with type="page" limit="10" %} 则能获取一个分页的文章列表,并将其赋值给 archives 变量。这些标签通常接受 id (ID)、categoryId (分类ID)、moduleId (模型ID)、order (排序方式) 等参数,帮助您精确筛选所需数据。
    • categoryDetailcategoryList:用于获取分类详情或分类列表。您可以根据 moduleIdparentId 参数来构建复杂的分类导航结构。
    • systemcontact:这些标签则用于获取网站全局设置(如网站名称 SiteName、备案号 SiteIcp)和联系方式(如联系电话 Cellphone、邮箱 Email)。
    • 还有 pageDetailpageList 用于单页面内容,tagDetailtagListtagDataList 用于标签相关数据,以及 linkList 用于友情链接等,都以类似的参数和方式工作。
  2. 控制流标签 这些标签让模板具备了编程语言般的逻辑能力。

    • if 条件判断{% if condition %} {% elif another_condition %} {% else %} {% endif %} 结构允许您根据不同的条件显示不同的内容。例如,{% if archive.Thumb %} <img src="{{ archive.Thumb }}" /> {% else %} <img src="/default-thumb.png" /> {% endif %} 可以根据文章是否有缩略图来选择显示不同的图片。
    • for 循环遍历{% for item in collection %} {% empty %} {% endfor %} 用于遍历列表或数组。当集合为空时,{% empty %} 块中的内容会被执行。在循环内部,item 变量代表当前循环到的元素,您还可以使用 forloop.Counter 来获取当前循环的索引。
  3. 功能性标签

    • stampToDate:这是一个非常实用的功能,可以将 Unix 时间戳格式化为可读的日期和时间字符串。例如,{{ stampToDate(item.CreatedTime, "2006-01-02 15:04") }} 将文章创建时间显示为“年-月-日 时:分”的格式。
    • pagination:用于生成分页导航,通常与 archiveList 配合使用,让用户能够浏览大量列表内容。
    • breadcrumb:自动生成面包屑导航,增强网站的用户体验和 SEO 友好性。
    • withset{% with key="value" %} {% endwith %}{% set new_var = "value" %} 用于在模板中定义临时变量,方便复杂逻辑或数据传递。

掌握过滤器:数据美化和转换的利器

过滤器是 AnQiCMS 模板系统中处理和格式化变量输出的强大工具。它们通过竖线符号 | 应用于变量之后,如 {{ 变量 | 过滤器名:参数 }}

  • safe:当您需要输出包含 HTML 内容的变量(如文章正文 archive.Content)时,为了避免 HTML 标签被转义为纯文本,必须使用 |safe 过滤器。例如:{{ archive.Content|safe }}
  • truncatechars / truncatewords:用于截断字符串到指定长度,并自动添加省略号。truncatechars 按字符数截断,truncatewords 按单词数截断,还有对应的 _html 版本用于安全处理 HTML 内容。
  • add / replace / split / join:进行字符串的拼接、替换、分割成数组或将数组拼接成字符串等操作。例如,{{ "Hello AnQiCMS"|replace:"AnQi,Go" }}
  • upper / lower / capfirst / title:转换英文字符串的大小写。
  • thumb:对于图片路径变量,|thumb 过滤器可以快速获取其缩略图版本。
  • render: 当您在后台启用了 Markdown 编辑器后,内容默认会以 Markdown 格式存储。使用 |render 过滤器可以在前端将其转换为 HTML 格式显示。

实际操作示例:动态构建页面

假设我们正在构建一个展示最新文章列表的首页,并希望每篇文章都包含标题、摘要、发布日期和缩略图。

”`twig {# 获取网站名称,用于页面标题 #} {% system with name=“SiteName” %} - 最新文章

最新文章

{# 使用 archiveList 标签获取文章列表,类型为列表,限制10篇,并显示flag属性 #} {% archiveList latest_archives with type="list" limit="10" showFlag=true %} {% for article in latest_archives %}

{{ article.Title }}

        <div class="article-body">
            {# 检查是否有缩略图,如果有则显示 #}
            {% if article.Thumb %}
                <a href="{{ article.Link }}" class="article-thumb">
                    <img src="{{ article.Thumb }}"