AnQiCMS模板如何循环遍历数组或对象来显示列表数据？

在安企CMS的模板系统中，要循环遍历数组或对象并显示列表数据，核心在于理解其Django-like的模板语法，特别是for循环标签的运用。这一机制让动态内容的呈现变得直观而高效，无论是文章列表、分类导航还是产品展示，都能灵活应对。

核心机制：for 循环的运用

安企CMS模板中的数据遍历，主要依赖于{% for ... in ... %}这一结构。当您从后台获取到一组数据（无论是文章集合、分类数组还是自定义的列表），它们通常会作为数组或可迭代的对象传递给模板。

例如，如果您通过某个标签（如archiveList或categoryList）获取了一组名为 items 的数据，您可以这样开始您的遍历之旅：

{% for item in items %}
    {# 在这里，您可以访问当前循环中的每个“item”的属性 #}
    <p>数据标题：{{ item.Title }}</p>
    <a href="{{ item.Link }}">查看详情</a>
{% endfor %}

在上述代码中：

• items 是您从后端获取到的数据集合（数组或切片）。
• item 是一个临时变量，代表了当前循环迭代中的单个数据元素。在每次循环中，item 都会自动更新为items中的下一个元素。
• {{ item.Title }} 和 {{ item.Link }} 则是访问当前item对象所包含的Title和Link属性。这些属性的名称通常与您在安企CMS后台配置时所定义的字段名相对应。

常见应用场景与标签实践

安企CMS提供了丰富的标签来获取不同类型的数据列表，这些标签获取到的数据都非常适合用for循环来遍历显示：

1. 显示文章或产品列表 (archiveList) archiveList标签是获取文章、产品等内容列表的利器。您可以指定分类、排序、数量等参数。例如，获取某个分类下的最新文章列表：

   {% archiveList latestArticles with categoryId="1" order="id desc" limit="5" %}
       {% for article in latestArticles %}
           <div class="article-item">
               <h3><a href="{{ article.Link }}">{{ article.Title }}</a></h3>
               <p>{{ article.Description | truncatechars:100 }}</p> {# 截取前100个字符作为简介 #}
               <small>发布日期：{{ stampToDate(article.CreatedTime, "2006-01-02") }} 阅读量：{{ article.Views }}</small>
           </div>
       {% endfor %}
   {% endarchiveList %}
   

   这里，article.Description可能包含HTML，使用|truncatechars:100过滤器可以安全地截取文本，并避免破坏HTML结构。stampToDate过滤器则将时间戳格式化为易读的日期。

2. 显示分类导航 (categoryList) 构建网站的导航菜单或侧边栏分类列表时，categoryList标签非常有用。它支持多级分类的获取：

   <ul class="main-nav">
       {% categoryList topCategories with moduleId="1" parentId="0" %} {# 获取文章模块的顶级分类 #}
           {% for category in topCategories %}
               <li {% if category.IsCurrent %}class="active"{% endif %}>
                   <a href="{{ category.Link }}">{{ category.Title }}</a>
                   {% if category.HasChildren %} {# 判断是否有子分类 #}
                       <ul class="sub-nav">
                           {% 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 %}
       {% endcategoryList %}
   </ul>
   

   在这个例子中，我们展示了如何通过嵌套for循环来构建多级导航，并利用category.IsCurrent来为当前所在分类添加样式。

3. 显示站点导航菜单 (navList) 后台“网站导航设置”中配置的菜单，可以通过navList标签获取并遍历：

   <nav>
       {% navList mainNav with typeId="1" %} {# 假设typeId=1是主导航 #}
           <ul>
               {% for navItem in mainNav %}
                   <li {% if navItem.IsCurrent %}class="active"{% endif %}>
                       <a href="{{ navItem.Link }}">{{ navItem.Title }}</a>
                       {% if navItem.NavList %} {# 如果有子菜单 #}
                           <ul class="dropdown-menu">
                               {% for subNavItem in navItem.NavList %}
                                   <li><a href="{{ subNavItem.Link }}">{{ subNavItem.Title }}</a></li>
                               {% endfor %}
                           </ul>
                       {% endif %}
                   </li>
               {% endfor %}
           </ul>
       {% endnavList %}
   </nav>
   

4. 显示自定义字段或图片集合 当您的内容模型中包含自定义的图片集合字段（例如在文章详情页中用于展示多图）或需要在页面上显示特定的参数列表时，同样可以使用for循环：

   {# 假设文章有一个名为“galleryImages”的自定义多图字段 #}
   {% archiveDetail currentArchive with name="galleryImages" %}
       {% if currentArchive.galleryImages %}
           <div class="image-gallery">
               {% for image in currentArchive.galleryImages %}
                   <img src="{{ image }}" alt="图集图片">
               {% endfor %}
           </div>
       {% endif %}
   {% endarchiveDetail %}
   
   {# 循环显示文章的自定义参数 #}
   {% archiveParams customParams %}
       <ul class="article-params">
           {% for param in customParams %}
               <li>{{ param.Name }}：{{ param.Value }}</li>
           {% endfor %}
       </ul>
   {% endarchiveParams %}
   

   在这里，currentArchive.galleryImages直接是一个图片URL的数组，archiveParams则返回一个包含Name和Value属性的对象数组，方便您统一展示。

增强列表显示：条件判断与辅助功能

在遍历数据的过程中，您可能会遇到一些特殊需求，例如根据条件显示不同内容、对列表项进行编号或处理空列表：

• 条件判断 (if)：通过{% if ... %}标签，您可以根据数据项的某个属性值来决定是否渲染特定内容，或者应用不同的样式。

  {% for item in articles %}
      {% if forloop.Counter == 1 %} {# 为列表中的第一个元素添加特殊样式 #}
          <li class="featured-article">
      {% else %}
          <li>
      {% endif %}
              <a href="{{ item.Link }}">{{ item.Title }}</a>
          </li>
  {% endfor %}
  

  forloop.Counter是循环内部的特殊变量，表示当前循环的序号（从1开始）。类似地，forloop.Revcounter表示从末尾开始的