在安企CMS中，让用户能够对文章进行评论，并清晰地展示这些评论，是提升网站互动性和用户参与度的重要一环。AnQiCMS强大的模板引擎和内置功能，使得这一过程既灵活又高效。本文将详细介绍如何在文章详情页中集成评论列表及其相关功能。

一、理解安企CMS的评论机制与模板结构

安企CMS内置了完善的评论管理功能，支持用户在文章页面提交评论，并在后台进行统一管理。要在前端页面显示这些评论，主要涉及对网站模板的编辑。

在AnQiCMS中，文章详情页通常对应模板目录下的{模型table}/detail.html（或扁平模式下的{模型table}_detail.html）文件。所有关于文章内容展示、以及与之相关的评论、上下篇文章等模块，都会在这个模板文件中进行调用和布局。

核心思想是利用AnQiCMS提供的模板标签，动态地从数据库中获取指定文章的评论数据，并将其渲染到页面上。

二、在文章详情页显示评论列表

要在文章详情页显示评论，需要使用到AnQiCMS提供的commentList标签。这个标签专门用于获取某个文档的评论列表或评论分页列表。

首先，确保您正在编辑的是文章详情页的模板文件（例如，template/default/article/detail.html）。

1. 获取当前文章ID

commentList标签需要知道是哪篇文章的评论。在文章详情页，当前文章的ID可以直接通过archive.Id来获取，因为archive变量通常代表了当前文章的详细数据。

2. 使用 commentList 标签获取评论数据

我们可以这样调用commentList标签来获取评论数据：

{% commentList comments with archiveId=archive.Id type="list" limit="10" order="id desc" %}
    {# 这里的 `comments` 是一个数组，包含了当前文章的评论数据 #}
    {% for item in comments %}
    <div class="comment-item">
        <div class="comment-header">
            <span class="username">
                {% if item.Status != 1 %}
                {# 评论状态为0表示审核中，可以做匿名处理或提示 #}
                审核中：{{item.UserName|truncatechars:6}}
                {% else %}
                {{item.UserName}}
                {% endif %}
            </span>
            {% if item.Parent %}
            {# 如果是回复某条评论，会存在Parent对象 #}
            <span class="reply-to">回复 {{item.Parent.UserName}}</span>
            {% endif %}
            <span class="comment-time">{{stampToDate(item.CreatedTime, "2006-01-02 15:04")}}</span>
        </div>
        <div class="comment-content">
            {% if item.Parent %}
            <blockquote class="reply-quote">
                {% if item.Parent.Status != 1 %}
                原评论审核中：{{item.Parent.Content|truncatechars:100}}
                {% else %}
                {{item.Parent.Content|truncatechars:100}}
                {% endif %}
            </blockquote>
            {% endif %}

            {% if item.Status != 1 %}
            该内容正在审核中，稍后可见。
            {% else %}
            {{item.Content|safe}} {# 注意这里使用 |safe 过滤器，以防评论内容包含HTML #}
            {% endif %}
        </div>
        <div class="comment-actions">
            <a class="praise-btn" data-id="{{item.Id}}">赞(<span class="vote-count">{{item.VoteCount}}</span>)</a>
            <a class="reply-btn" data-id="{{item.Id}}" data-user="{{item.UserName}}">回复</a>
        </div>
    </div>
    {% endfor %}
{% empty %}
    <p>暂无评论，快来发表您的看法吧！</p>
{% endcommentList %}

代码解释：

  • comments：我们为评论列表定义的变量名。
  • archiveId=archive.Id：指定获取当前文章（ID为archive.Id）的评论。
  • type="list"：表示获取一个固定数量的列表，而非分页列表。如果您希望评论列表可以分页，请将type设置为"page"。
  • limit="10"：每页（或每次显示）显示10条评论。
  • order="id desc"：按评论ID降序排列，即最新评论显示在最前面。
  • {% for item in comments %}：遍历获取到的评论数据。
  • item.Status：评论的审核状态。1表示审核通过，其他值可能表示审核中或未通过。为了用户体验，我们通常只显示审核通过的评论，或对审核中的评论进行提示。
  • item.Parent：如果这条评论是对另一条评论的回复，item.Parent会包含被回复评论的详细信息，这有助于构建嵌套评论的样式。
  • {{stampToDate(item.CreatedTime, "2006-01-02 15:04")}}：使用stampToDate过滤器将时间戳转换为易读的日期时间格式。
  • {{item.Content|safe}}：显示评论内容。重要提示： 用户提交的评论内容可能包含HTML标签。为防止XSS攻击，AnQiCMS默认会对输出进行转义。如果您的评论编辑器允许用户提交富文本（带HTML标签），并且您希望这些HTML标签被浏览器解析，则