重要提示：此文档不适用于您当前选择的格式 电子邮件！

amp-date-display

您现在可以使用此组件在有效的 AMP 文档之外使用此组件的 Bento 版本。在 Bento 指南中了解更多信息。

描述

amp-date-display 组件显示您可以在 AMP 页面中呈现的时间数据。

必需脚本

<script async custom-element="amp-date-display" src="https://cdn.ampproject.org/v0/amp-date-display-0.1.js"></script>

支持的布局

fill fixed fixed-height flex-item nodisplay responsive

用法

amp-date-display 组件显示您可以在 AMP 页面中呈现的时间数据。通过在 amp-date-display 标签中提供特定的属性，amp-date-display 扩展返回时间参数列表，您可以将其传递给 amp-mustache 模板进行呈现。请参阅下面返回的每个时间参数列表。

<!-- Displays "Wednesday 2 August 2017, 15:05:05" -->
<amp-date-display
  datetime="2017-08-02T15:05:05.000"
  layout="fixed"
  width="360"
  height="20"
>
  <template type="amp-mustache">
    <div>
{{dayName}} {{day}} {{monthName}} {{year}}{{hourTwoDigit}}:{{minuteTwoDigit}}:{{secondTwoDigit}}    </div>
  </template>
</amp-date-display>

返回的时间参数

此表列出了您可以在 Mustache 模板中指定的格式

格式	含义
day	1, 2, ...12, 13, 等。
dayName	字符串，
dayNameShort	字符串，
dayPeriod	字符串，
dayTwoDigit	01, 02, 03, ..., 12, 13, 等。
hour	0, 1, 2, 3, ..., 12, 13, ..., 22, 23
hour12	1, 2, 3, ..., 12, 1, 2, ..., 11, 12
hour12TwoDigit	01, 02, ..., 12, 01, 02, ..., 11, 12
hourTwoDigit	00, 01, 02, ..., 12, 13, ..., 22, 23
iso	标准 ISO8601 日期字符串，例如 2019-01-23T15:31:21.213Z，
localeString	具有语言敏感表示的字符串。
minute	0, 1, 2, ..., 58, 59
minuteTwoDigit	00, 01, 02, ..., 58, 59
month	1, 2, 3, ..., 12
monthName	国际化的月份名称字符串。
monthNameShort	国际化的缩写月份名称字符串，
monthTwoDigit	01, 02, ..., 11, 12
second	0, 1, 2, ..., 58, 59
secondTwoDigit	00, 01, 02, ..., 58, 59
timeZoneName	国际化的时区，例如 `Pacific Daylight Time`
timeZoneNameShort	国际化的时区，缩写形式，例如 `PST`
year	0, 1, 2, ..., 1999, 2000, 2001, 等。
yearTwoDigit	00, 01, 02, ..., 17, 18, 19, ..., 98, 99

属性

您必须指定至少一个必需属性：datetime、timestamp-ms 或 timestamp-seconds。

datetime

datetime 属性以标准 ISO 8601 日期字符串（例如 2017-08-02T15:05:05.000Z）或字符串 now 指定日期和时间。如果设置为 now，amp-date-display 将使用页面加载的时间来呈现其模板。

timestamp-ms

timestamp-ms 属性使用自 1970-01-01T0:00:00.000Z 以来的毫秒数指定日期和时间

timestamp-seconds

timestamp-seconds 属性使用自 1970-01-01T0:00:00.000Z 以来的秒数指定日期和时间

locale（可选）

每个计时器单元的国际化语言字符串。默认值为 en（英语）。此属性支持用户浏览器支持的所有值。

display-in（可选）

如果设置为值 utc，display-in 属性会将给定的日期转换为 UTC。

offset-seconds（可选）

offset-seconds 属性指定要移动给定日期的整数秒数。

data-options-*（可选）

data-options-* 支持 Intl.DateTimeFormat.options 参数下的所有选项，该参数指定用于 localeString 格式的格式样式。有效属性包括：data-options-date-style、data-options-time-style 等。

请注意，如果 display-in 属性设置为 utc，data-options-time-zone 的值将自动转换为 UTC。

验证

请参阅 AMP 验证器规范中的 amp-date-display 规则。

需要更多帮助？

您已经阅读了本文档十几次，但它并没有真正涵盖您所有的问题？也许其他人也有同样的感受：在 Stack Overflow 上与他们联系。

转到 Stack Overflow

发现错误或缺少功能？

AMP 项目强烈鼓励您的参与和贡献！我们希望您能成为我们开源社区的持续参与者，但也欢迎您为自己特别关注的问题做出一次性贡献。

转到 GitHub

amp-date-display 1.0 0.1

描述