重要事項：此文件不適用於您目前選擇的格式廣告！

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

描述