在网站内容展示中,我们经常遇到这样的需求:根据数据循环的次序、数据的特定属性或状态,来显示不同的内容,或者赋予元素独特的样式。比如,列表中的奇偶行需要不同背景色,特定类型的产品需要特别标注,或者当某个字段为空时隐藏相应的区域。
安企CMS凭借其灵活强大的Django-like模板引擎,让这些需求变得简单易行。通过巧妙地结合循环标签({% for ... %})和条件判断标签({% if ... %}系列),您将能够对网站内容的展示方式拥有精准的控制力。
核心功能解析:循环与条件判断的基石
首先,让我们回顾一下实现条件性显示和样式定制的两个核心工具:
1. 循环标签({% for ... %})
这是您遍历数据集的基础。无论是文章列表、产品分类,还是导航菜单,for标签都能帮助您逐一访问集合中的每个元素。例如,您可以通过{% archiveList archives with type="page" limit="10" %}获取文章列表,然后用{% for item in archives %}来遍历这些文章。
在循环内部,item变量代表当前迭代到的数据对象,它包含了文章的标题(item.Title)、链接(item.Link)等各种属性。
2. 条件判断标签({% if ... %} 系列)
这是实现“条件性”的关键。安企CMS提供了{% if 条件 %}、{% elif 其他条件 %}(else if的缩写)和{% else %}标签,让您能够根据表达式的真假来决定哪些内容会被渲染,哪些样式会被应用。例如,{% if item.Thumb %}可以判断当前文章是否有缩略图。
3. 循环内置变量(forloop.Counter 与 forloop.Revcounter)
在for循环中,您还可以访问一些特殊的内置变量,它们提供了关于当前循环状态的信息,这对于定制化样式尤其有用:
forloop.Counter: 当前循环的序号,从1开始计数。forloop.Revcounter: 当前循环剩余的元素数量。forloop.First: 如果当前是循环的第一个元素,则为True。forloop.Last: 如果当前是循环的最后一个元素,则为True。
掌握了这些基础工具,我们就可以开始构建各种实用的条件性展示场景了。
实战演练:灵活运用条件性显示
以下是一些常见的需求场景及其实现方法:
场景一:为奇数/偶数行设置不同样式
为了让数据列表更易读,我们常常需要对奇数行和偶数行应用不同的背景色或边框。
实现方式: 利用forloop.Counter和divisibleby过滤器(用于判断是否能被整除)。
{% for item in archives %}
<div class="list-item {% if forloop.Counter|divisibleby:2 %}even-row{% else %}odd-row{% endif %}">
<h3>{{ item.Title }}</h3>
<p>{{ item.Description }}</p>
</div>
{% endfor %}
这里,forloop.Counter|divisibleby:2会检查当前行数是否为偶数。如果为偶数,则应用even-row类;否则应用odd-row类。
场景二:突出显示列表的首尾元素
有时候,您可能需要给列表的第一个元素或最后一个元素添加特殊的视觉效果,例如“最新”或“推荐”标识。
实现方式: 利用forloop.First和forloop.Last。
{% for item in archives %}
<div class="list-item {% if forloop.First %}first-highlight{% elif forloop.Last %}last-special{% endif %}">
{% if forloop.First %}
<span class="badge new-badge">最新</span>
{% endif %}
<h3>{{ item.Title }}</h3>
<p>{{ item.Description }}</p>
</div>
{% endfor %}
这段代码会给列表的第一个元素添加first-highlight类和“最新”徽章;给最后一个元素添加last-special类。
场景三:根据特定数据值显示不同内容或样式
如果您希望根据文章ID、分类名称或某个字段的具体值来显示或隐藏内容,或者改变样式,这是最常用的条件判断。
实现方式: 直接比较数据对象的属性值。
”`twig {% for item in archives %}
<div class="list-item">
{% if item.