在网站运营中,我们经常需要构建复杂且层次分明的内容结构,例如多级分类导航、产品树形结构,或是分类下嵌套展示相关文章等。安企CMS(AnQiCMS)凭借其灵活的模板引擎和丰富的标签功能,使得在模板中遍历和显示这些嵌套结构变得简单而高效。
安企CMS的模板系统采用了类似Django的语法,这意味着您将主要通过 {{变量}} 来输出数据,并通过 {% 标签 %} 来执行逻辑控制,例如条件判断和循环遍历。深入理解 {% for ... in ... %} 循环标签以及各个数据标签的参数和返回结构,是实现复杂嵌套展示的关键。
理解模板中的循环与判断
在AnqiCMS模板中,{% for item in items %} 结构是遍历列表数据的核心。每次循环,item 变量都会指向列表中的一个元素,您可以通过 item.属性名 的形式访问其内部数据。例如,当遍历一个分类列表时,item 可能代表一个分类对象,您可以访问 item.Title(分类标题)、item.Link(分类链接)等。
同时,{% if 条件 %} 标签允许您根据数据的特定状态进行条件渲染,这在处理嵌套结构时尤其有用,例如判断一个分类是否有子分类。如果遍历的列表可能为空,您还可以使用 {% empty %} 标签来为没有内容的情况提供替代展示。
遍历和显示嵌套分类结构
安企CMS提供了 categoryList 标签来获取分类数据。要实现嵌套分类的展示,核心在于巧妙地利用 parentId 参数和分类对象自身的 HasChildren 属性。
首先,您可以获取顶级的分类列表:
{% categoryList categories with moduleId="1" parentId="0" %}
{# 一级分类列表 #}
<ul>
{% for category in categories %}
<li>
<a href="{{ category.Link }}">{{ category.Title }}</a>
{# 判断当前分类是否有子分类 #}
{% if category.HasChildren %}
{# 如果有子分类,则再次调用 categoryList 标签,并将其 parentId 设置为当前分类的ID #}
<ul>
{% categoryList subCategories with parentId=category.Id %}
{% for subCategory in subCategories %}
<li><a href="{{ subCategory.Link }}">{{ subCategory.Title }}</a></li>
{% endfor %}
{% endcategoryList %}
</ul>
{% endif %}
</li>
{% endfor %}
</ul>
{% endcategoryList %}
这段代码展示了如何递归地遍历两级分类。对于更深层次的嵌套,您可以按照相同的模式,在 subCategories 的循环内部再次检查 subCategory.HasChildren 并调用 categoryList。
在嵌套分类中显示关联内容
网站结构往往需要将分类与具体内容(如文章、产品)关联起来。在AnqiCMS中,您可以将 categoryList 标签与 archiveList 标签结合使用,在展示分类的同时,也显示该分类下的部分内容。
{% categoryList categories with moduleId="1" parentId="0" %}
{# 遍历一级分类 #}
{% for category in categories %}
<div class="category-block">
<h3><a href="{{ category.Link }}">{{ category.Title }}</a></h3>
<ul>
{# 在每个分类下,获取其关联的文章列表 #}
{% archiveList articles with type="list" categoryId=category.Id limit="5" %}
{% for article in articles %}
<li>
<a href="{{ article.Link }}">{{ article.Title }}</a>
<span>{{ stampToDate(article.CreatedTime, "2006-01-02") }}</span>
</li>
{% empty %}
<li>该分类暂无文章。</li>
{% endfor %}
{% endarchiveList %}
</ul>
</div>
{% endfor %}
{% endcategoryList %}
这里,archiveList 标签通过 categoryId=category.Id 参数,精确地获取了当前循环分类下的文章。您可以根据需要调整 limit 参数来控制显示的文章数量。
巧用导航列表实现多级菜单
除了手动构建分类嵌套,安企CMS的 navList 标签是构建多级导航菜单的理想选择。该标签直接返回一个已经处理好嵌套关系的数据结构,极大地简化了多级菜单的开发。
后台配置好的多级导航,在模板中可以直接这样调用:
{% navList mainNavs %}
<ul class="main-menu">
{% for nav in mainNavs %}
<li {% if nav.IsCurrent %}class="active"{% endif %}>
<a href="{{ nav.Link }}">{{ nav.Title }}</a>
{# 判断当前导航项是否有子导航 #}
{% if nav.NavList %}
<ul class="sub-menu">
{% for subNav in nav.NavList %}
<li {% if subNav.IsCurrent %}class="active"{% endif %}>
<a href="{{ subNav.Link }}">{{ subNav.Title }}</a>
{# 还可以继续检查 subNav.NavList 实现更深层次的嵌套 #}
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %}
</ul>
{% endnavList %}
navList 返回的 nav 对象具有 NavList 属性,可以直接用于遍历其子导航项,这让多级菜单的构建非常直观。
更进一步,您甚至可以在这些导航项下,根据其关联的 PageId(如果导航项链接的是某个分类或单页),再次调用 archiveList 或 categoryList 来展示相关内容:
{% navList mainNavs %}
<ul class="main-menu">
{% for nav in mainNavs %}
<li>
<a href="{{ nav.Link }}">{{ nav.Title }}</a>
{% if nav.NavList %}
<ul class="sub-menu">
{% for subNav in nav.NavList %}
<li>
<a href="{{ subNav.Link }}">{{ subNav.Title }}</a>
{# 如果子导航关联的是一个分类,显示该分类下的文章 #}
{% if subNav.PageId > 0 %}
{% archiveList articles with type="list" categoryId=subNav.PageId limit="3" %}
{% if articles %}
<div class="articles-in-menu">
{% for article in articles %}
<p><a href="{{ article.Link }}">{{ article.Title }}</a></p>
{% endfor %}
</div>
{% endif %}
{% endarchiveList %}
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %}
</ul>
{% endnavList %}
这个例子将导航、分类与内容巧妙地结合起来,构建出高度动态和丰富的信息展示。
模型自定义字段的嵌套应用
在安企CMS中,内容模型和分类都支持自定义字段。这些自定义字段也可以包含更复杂的、嵌套的数据结构,例如图片组图(Images)。您可以通过循环遍历这些字段来实现它们的展示。
如果文档详情页有一个名为 Images 的自定义图片组字段:
{% archiveDetail archiveImages with name="Images" %}
<div class="product-gallery">
{% for img in archiveImages %}
<img src="{{ img }}" alt="产品图片">
{% endfor %}
</div>
{% endarchiveDetail %}
类似地,如果您在后台为分类或文档模型定义了 Extra 参数(例如包含多个键值对的附加信息),可以通过 archiveParams 或 categoryDetail 获取后进行遍历:
{% archiveParams params %}
<div class="extra-info">
{% for item in params %}
<p><strong>{{ item.Name }}:</strong> {{ item.Value }}</p>
{% endfor %}
</div>
{% endarchiveParams %}
这使得您可以灵活地展示自定义数据,无论是简单的文本还是复杂的图片集合。
总结
安企CMS的模板引擎提供了强大的灵活性来处理各种嵌套结构。通过熟练运用 {% for %}、{% if %} 标签,以及 categoryList、archiveList 和 `navList