在网站运营中,我们经常需要在前端页面展示各种时间信息,比如文章发布日期、内容更新时间或者用户评论时间。AnQiCMS作为一个企业级内容管理系统,在数据存储时通常会采用Unix时间戳这种高效简洁的格式。然而,对于访问网站的用户来说,一串数字时间戳显然不够直观和友好。那么,如何在AnQiCMS的模板中,将这些时间戳转换为易于阅读的日期格式呢?

AnQiCMS提供了一个非常实用的内置标签和过滤器,让这一转换过程变得简单快捷,即便您不深入了解Go语言的底层细节,也能轻松实现。

理解AnQiCMS模板中的时间戳

在AnQiCMS内部,像文章的 CreatedTime(创建时间)和 UpdatedTime(更新时间)、评论的 CreatedTime、用户登录日志的 LastLogin 等字段,其值通常以10位或更多位数的Unix时间戳形式存储。这是一个表示从1970年1月1日00:00:00 UTC(协调世界时)起经过的秒数的整数。这种存储方式便于系统进行排序、比较和跨时区处理,但在展示给用户时,我们更希望看到“2023年10月27日”或“上午10:30”这样的格式。

核心工具:stampToDate 标签/过滤器

AnQiCMS为我们提供了 stampToDate 这个强大的标签,它能够直接在模板中将时间戳转换为我们需要的可读日期格式。

它的基本使用语法非常直观: {{ stampToDate(您的时间戳变量, "目标日期格式字符串") }}

这里有两个关键部分:

  1. 您的时间戳变量:这通常是您从 archiveListarchiveDetail 或其他数据标签中获取到的包含时间戳的字段,例如 item.CreatedTimearchive.UpdatedTime
  2. 目标日期格式字符串:这是决定日期最终显示样式的字符串。与一些其他编程语言不同,Go语言(AnQiCMS底层开发语言)的日期格式化字符串是基于一个固定的“参照时间”来定义的,而不是使用像Y-m-d H:i:s这样的占位符。这个神奇的参照时间是:2006-01-02 15:04:05

这意味着:

  • 2006代表年份
  • 01代表月份(January)
  • 02代表日期
  • 15代表24小时制的小时
  • 04代表分钟
  • 05代表秒

您只需将这个参照时间中的数字替换成您想要的格式符号即可。例如:

  • 要显示 年-月-日"2006-01-02"
  • 要显示 年/月/日"2006/01/02"
  • 要显示 年 月 日 (中文)"2006年01月02日"
  • 要显示 时:分:秒"15:04:05"
  • 要显示 完整的日期和时间"2006-01-02 15:04:05"
  • 要显示 简短的月日"01-02"
  • 要显示 上午/下午时分"03:04 PM"(注意,这里的03代表12小时制的小时,PM表示上午/下午)

在AnQiCMS模板中的实际应用

让我们通过一个具体的例子来看看如何在文章列表和文章详情页中使用 stampToDate

假设您有一个文章列表页面,并且希望显示每篇文章的发布时间和更新时间,以及在文章详情页显示详细的发布时间。

文章列表模板示例 ({模型table}/list.html 或首页 index.html 部分)

<div class="articles-list">
    {% archiveList archives with type="page" limit="10" %}
        {% for item in archives %}
        <article class="article-item">
            <h2><a href="{{item.Link}}">{{item.Title}}</a></h2>
            <div class="article-meta">
                <span>发布于:{{ stampToDate(item.CreatedTime, "2006年01月02日") }}</span>
                <span>更新于:{{ stampToDate(item.UpdatedTime, "2006/01/02 15:04") }}</span>
                <span>阅读量:{{item.Views}}</span>
            </div>
            <p class="article-description">{{item.Description}}</p>
            <a href="{{item.Link}}" class="read-more">阅读更多</a>
        </article>
        {% empty %}
        <p>暂时没有内容。</p>
        {% endfor %}
    {% endarchiveList %}

    {# 如果是分页列表,别忘了加上分页导航 #}
    <div class="pagination-controls">
        {% pagination pages with show="5" %}
            {# 分页代码略,参考AnQiCMS分页标签文档 #}
        {% endpagination %}
    </div>
</div>

在这个示例中:

  • item.CreatedTime 被格式化为“xxxx年xx月xx日”。
  • item.UpdatedTime 被格式化为“xxxx/xx/xx xx:xx”。

文章详情模板示例 ({模型table}/detail.html)

”`twig

<h1>{{archive.Title}}</h1>
<div class="article-info">
    <span>发布时间:{{ stampToDate(archive.CreatedTime, "2006年01月02日 15时04分05秒") }}</span>
    <span>更新时间:{{ stampToDate(archive.UpdatedTime, "2006-01-02 15:04:05") }}</span>
    <span>阅读量:{{archive.Views}}</span>
</div>
<div class="article-content">
    {{archive.Content|safe}}
</div>

<div class="article-tags">
    {% tagList tags with itemId=archive.Id limit="5" %}
        {% for tag in tags %}
        <a href="{{tag.Link}}">{{tag.Title}}</a>
        {% endfor %}
    {% endtagList %}
</div>

<div class="navigation-links">
    {% prevArchive prev %}
        {% if prev %}<a href="{{prev.Link}}">上一篇:{{prev.Title}}</a>{% else %}<span>没有上一篇了</span>{% endif %}
    {% endprevArchive %}
    {% nextArchive next %}