AMP

amp-timeago

實驗性
Bento

說明

透過將日期格式化為多久以前 (例如,3 小時前) 來提供模糊時間戳記。

 

必要指令碼

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

支援的版面配置

範例

用法

使用 amp-timeago 元件來向上或向下計數到指定的日期和時間。

此元件會將文字節點替換為模糊時間戳記,例如 in 30 years3 hours ago

範例

2017 年 4 月 11 日星期六 00:37
<amp-timeago
  layout="fixed"
  width="160"
  height="20"
  datetime="2017-04-11T00:37:33.809Z"
  locale="en"
>
  Saturday 11 April 2017 00.37
</amp-timeago>
在 Playground 中開啟此程式碼片段

amp-timeago 元件需要在文字節點中加入預留位置。計算出的時間戳記會在準備就緒後取代預留位置。如果 amp-timeago 無法處理模糊時間戳記,請使用預留位置作為後備方案向使用者顯示。

在有效的 AMP 文件之外獨立使用

Bento 可讓您在非 AMP 頁面中使用 AMP 元件,而無需完全採用有效的 AMP。您可以取得這些元件,並將它們放置在不支援 AMP 的架構和 CMS 的實作中。請參閱我們的指南 在非 AMP 頁面中使用 AMP 元件 以瞭解詳情。

若要尋找 amp-timeago 的獨立版本,請參閱 bento-timeago

屬性

datetime

必要的 datetime 屬性會設定日期和時間。值必須是 ISO 日期時間

  • 以 UTC (協調世界時間) 表示時間:2017-03-10T01:00:00Z
  • 以當地時間和時區偏移量表示:2017-03-09T20:00:00-05:00

locale (選用)

預設地區設定為 en。新增 locale 屬性並指定下列其中一個值來變更地區設定。

  • ar (阿拉伯文)
  • be (白俄羅斯文)
  • bg (保加利亞文)
  • bn-IN (孟加拉文)
  • ca (加泰隆尼亞文)
  • cs (捷克文)
  • da (丹麥文)
  • de (德文)
  • el (希臘文)
  • en (英文)
  • en-short (英文 - 簡短)
  • es (西班牙文)
  • eu (巴斯克文)
  • fa (波斯文 - 法西語)
  • fi (芬蘭文)
  • fr (法文)
  • gl (加利西亞文)
  • he (希伯來文)
  • hi-IN (印地文)
  • hu (匈牙利文)
  • id-ID (馬來文)
  • it (義大利文)
  • ja (日文)
  • ka (喬治亞文)
  • ko (韓文)
  • ml (馬拉雅拉姆文)
  • my (緬甸文)
  • nb-NO (挪威博克莫爾文)
  • nl (荷蘭文)
  • nn-NO (挪威尼諾斯克文)
  • pl (波蘭文)
  • pt-BR (葡萄牙文)
  • ro (羅馬尼亞文)
  • ru (俄文)
  • sq (阿爾巴尼亞文)
  • sr (塞爾維亞文)
  • sv (瑞典文)
  • ta (坦米爾文)
  • th (泰文)
  • tr (土耳其文)
  • uk (烏克蘭文)
  • vi (越南文)
  • zh-CN (中文)
  • zh-TW (台灣)

cutoff

新增 cutoff 屬性可在超過指定秒數後顯示 datatime 屬性中指定的日期。

通用屬性

AMP 提供的 通用屬性 集可用於 <amp-timeago>

需要更多協助嗎?

您已經讀過這份文件好幾次了,但它仍然沒有真正涵蓋您的所有問題嗎?也許其他人也有同感:請在 Stack Overflow 上與他們聯繫。

前往 Stack Overflow
發現錯誤或缺少功能?

AMP 專案非常鼓勵您的參與和貢獻!我們希望您能成為我們開放原始碼社群的長期參與者,但我們也歡迎您針對您特別熱衷的問題做出一次性貢獻。

前往 GitHub