在安企CMS中,模板是网站内容呈现的核心,它不仅负责内容的布局和样式,更承担着根据不同条件展示不同内容、以及循环呈现数据列表的重要职责。要让您的网站内容更具动态性和交互性,深入理解如何在模板中实现条件判断和循环遍历就显得尤为关键。安企CMS的模板引擎采用了类似Django的语法,这使得熟悉Web开发的您能够快速上手并灵活应用。
理解 AnQiCMS 模板基础
在AnQiCMS的模板文件中,变量的输出通常使用双花括号来定义,比如 {{变量名称}}。而进行条件判断和循环控制这类逻辑操作时,则会用到单花括号和百分号包裹的标签,例如 {% 标签名称 参数 %}。这些逻辑标签总是成对出现的,需要一个开启标签和一个结束标签来界定其作用范围,如 {% if 条件 %} ... {% endif %} 或 {% for item in 列表 %} ... {% endfor %}。正确使用这些标签,是控制内容显示灵活性的第一步。
灵活的内容展示:条件判断 if 标签
条件判断是模板中不可或缺的一部分,它允许您根据数据的特定状态来决定哪些内容应该被显示,哪些应该被隐藏或以不同方式呈现。if 标签是实现这一功能的核心。
最基本的条件判断形式是 {% if 条件 %} ... {% endif %}。例如,您可能希望只有当某篇文章的ID等于10时才显示一段特殊提示:
{% if archive.Id == 10 %}
<p>这是ID为10的特别推荐文章!</p>
{% endif %}
这里的 archive.Id 是当前文档的ID,您可以将其替换为任何可用的变量或表达式。
当您需要处理更复杂的逻辑时,可以使用 elif(else if 的缩写)和 else 标签,来构建多分支的条件判断结构。比如,根据文章的浏览量显示不同的热门程度:
{% if archive.Views > 1000 %}
<p>🔥 超级热门文章!</p>
{% elif archive.Views > 500 %}
<p>✨ 热门推荐!</p>
{% else %}
<p>📖 最新发布!</p>
{% endif %}
这种结构使得内容的显示可以根据多个层次的条件进行精确控制。
除了数值比较,if 标签还能用于判断变量是否存在、是否为真、列表是否为空等多种场景。例如,要检查一个图片路径变量 item.Thumb 是否存在,以避免显示一个空图片标签:
{% if item.Thumb %}
<img src="{{ item.Thumb }}" alt="{{ item.Title }}">
{% else %}
<img src="/static/images/default.jpg" alt="默认图片">
{% endif %}
您还可以结合过滤器(filters)进行更细致的判断,比如判断一个字符串变量是否包含某个关键词,或者检查分页数据是否是当前页,以便给当前页面链接添加 active 样式:
{# 假设 pages.FirstPage 是一个分页对象,其 IsCurrent 属性表示是否为当前页 #}
<a class="{% if pages.FirstPage.IsCurrent %}active{% endif %}" href="{{pages.FirstPage.Link}}">首页</a>
通过灵活运用 if、elif、else 和各种表达式,您能够为网站的每个部分设计出高度定制化的显示逻辑。
动态内容呈现:循环遍历 for 标签
循环遍历功能是处理列表型数据(如文章列表、产品列表、分类导航等)的利器。for 标签允许您迭代一个集合中的每个元素,并为每个元素生成相应的HTML结构。
for 标签的基本语法是 {% for item in 集合 %} ... {% endfor %}。这里的 集合 通常是一个数组或列表,而 item 是在每次循环中代表当前元素的临时变量。例如,显示一个文章列表:
{% archiveList archives with type="list" limit="5" %}
{% for item in archives %}
<li>
<a href="{{item.Link}}">
<h5>{{item.Title}}</h5>
<p>{{item.Description}}</p>
</a>
</li>
{% endfor %}
{% endarchiveList %}
在这个例子中,archiveList 标签获取了前5篇文章,然后 for 循环遍历 archives 集合,为每篇文章生成一个列表项。
当您需要处理集合可能为空的情况时,for 标签提供了一个 {% empty %} 子句,它会在集合为空时执行其内部的内容,而不是显示一个空的列表。这对于用户体验非常友好:
{% archiveList archives with type="list" limit="5" %}
{% for item in archives %}
<li>
{# 文章内容 #}
</li>
{% empty %}
<p>目前还没有任何文章发布。</p>
{% endfor %}
{% endarchiveList %}
for 循环还提供了一些内置的辅助变量,让循环控制更加精细。例如,forloop.Counter 可以获取当前循环的索引(从1开始),forloop.Revcounter 获取当前循环的倒序索引。这在需要为列表项添加序号或特殊样式时非常方便:
{% for item in archives %}
<li class="{% if forloop.Counter == 1 %}first-item{% endif %}">
<span>第 {{ forloop.Counter }} 篇:</span>
<a href="{{item.Link}}">{{item.Title}}</a>
</li>
{% endfor %}
除了基础遍历,for 标签还支持一些修饰符:
reversed:用于倒序遍历集合。{% for item in archives reversed %}sorted:通常用于对集合进行默认排序(文档中提到按 int 排序,实际可能根据数据类型有不同表现)。{% for item in archives sorted %}cycle:实现循环输出一系列值,比如交替的行背景色。{% for item in archives %}<li class="{% cycle 'even' 'odd' %}">...</li>{% endfor %}
嵌套循环也是 for 标签的强大功能之一。例如,在网站导航或产品分类中,您可能需要显示多级分类结构:
{% categoryList categories with moduleId="1" parentId="0" %} {# 获取一级分类 #}
<ul>
{% for item in categories %}
<li>
<a href="{{ item.Link }}">{{ item.Title }}</a>
{% if item.HasChildren %} {# 判断是否有子分类 #}
{% categoryList subCategories with parentId=item.Id %} {# 获取当前一级分类下的子分类 #}
<ul>
{% for inner in subCategories %}
<li><a href="{{ inner.Link }}">{{ inner.Title }}</a></li>
{% endfor %}
</ul>
{% endcategoryList %}
{% endif %}
</li>
{% endfor %}
</ul>
{% endcategoryList %}
通过这种方式,您可以轻松构建出深度和结构各异的动态内容区块。
优化与调试小贴士
在模板开发过程中,一些小技巧能帮助您提高效率和代码质量:
- 模板注释:使用
{# 这是单行注释 #}进行单行注释,或使用{% comment %} 这是多行注释 {% endcomment %}进行多行注释。这有助于代码的可读性和维护性,且这些注释不会出现在最终渲染的HTML中。 - 去除空白行:模板引擎在渲染时可能会因为逻辑