amp-live-list
简介
amp-live-list 组件支持将实时更新发布到 AMP 页面，因为新内容在源文档中可用。这对于实现实时博客非常有用。在这里找到实时博客的示例此处。
换句话说，AMP 运行时将轮询服务器以获取源文档的更新，从而自行获取。服务器可以返回整个 AMP 页面或其一部分，并且运行时会无缝地就地更新页面。
设置
在标头中导入 amp-live-list 组件。
<script async custom-element="amp-live-list" src="https://cdn.ampproject.org/v0/amp-live-list-0.1.js"></script>
用户交互后更新：实时博客
使用 data-poll-interval 属性来指定 amp-live-list 组件轮询新数据的频率。最小间隔为 15 秒。使用 data-max-items-per-page 来指定页面上显示的最大数量。有关所有属性的详细说明，请参阅amp-live-list。
使用 on="tap:my-live-list.update" 从服务器加载最新更改。当 AMP 运行时发现新的文档更改时，将出现一个按钮。请注意，该按钮必须定义为 amp-live-list 的直接子级。
amp-live-list 必须包含 <div items> 下的项目列表。每个项目都有一个特定的 id，并且 amp-live-list 将查找具有新 id 的项目。
通过单击“您有更新”按钮，新内容会显示在演示列上（如果通过桌面访问演示，则在右侧）。代码列（如果通过桌面访问演示，则在中间）不会自行更新，但是如果您想查看页面上的所有项目，请重新加载页面。
<amp-live-list layout="container" data-poll-interval="15000" data-max-items-per-page="5" id="amp-live-list-insert-blog">
<button update on="tap:amp-live-list-insert-blog.update">You have updates</button>
<div items>
</div>
</amp-live-list>
amp-live-list 的内容是随机生成的（为了更轻松和可重复的测试）。自动更新
如果要更新现有列表项而无需用户交互，则需要通过 data-update-time 属性指定执行更新的时间。以下示例将显示并自动更新当前时间。此方法非常适合显示实时比分或实时市场价值。
时间是：
<amp-live-list layout="container" data-poll-interval="15000" data-max-items-per-page="1" id="amp-live-list-update">
<button update on="tap:amp-live-list-insert-blog.update">You have updates</button>
<div items>
<div id="time" data-sort-time="1234567" data-update-time="" class="time">
The time is: <time></time>
</div>
</div>
</amp-live-list>
需要进一步的解释？
如果此页面上的解释没有涵盖您的所有问题，请随时与其他 AMP 用户联系，讨论您的具体用例。
前往 Stack Overflow 一个未解释的功能？AMP 项目强烈鼓励您的参与和贡献！我们希望您成为我们开源社区的长期参与者，但我们也欢迎您为自己特别感兴趣的问题做出一次性贡献。
在 GitHub 上编辑示例