使用 AMP HTML，是否可以从单击的元素获取 ID 或其他属性，附加它们并为锚标记创建 URL？

Question

我有一套检查输入法。每个都包含一个唯一的 ID。在复选框（单击）上，我想获取此 ID 并创建类型为 '/some/path/?myids=checkOne,checkTwo 的字符串（其中 checkOne 和 checkTwo 是已单击的两个不同检查输入的 ID。

我知道我可以使用状态管理 - 但我的问题是：如何限制为其创建自定义字符串的复选框数量？例如，我希望限制为 5 个以逗号分隔的 ID。由于 AMP 逻辑有限，我不确定如何使用它来处理复杂的逻辑。

步骤如下：

显示一组复选框。
用户可以单击这些复选框中的任何一个
当用户点击一个复选框时，achor 标签 href=... 需要通过附加子字符串 ?myids=checkOne 来更新。
如果用户点击另一个复选框，则 href 标签需要更新为：?myids=checkOne、checkTwo 等等，直到最多点击 5 个复选框。

这可能吗？谢谢

关于如何近似复杂逻辑的文档不是很清楚，在搜索时也找不到很多。

Answer 1

一种选择是使用 amp-selector and then limit the number of selected items when binding using .slice():

<amp-state id="selected">
  <script type="application/json">[]</script>
</amp-state>

<amp-selector layout="container" multiple on="select:AMP.setState({selected: event.selectedOptions})">
  <div option="1">First</div>
  <div option="2">Second</div>
  <div option="3">Third</div>
</amp-selector>

<div hidden [hidden]="selected.length < 3">You can only select two options.</div>
<a href="/?ids=" [href]="'/?ids=' + selected.slice(0, 2)">Click me</a>

这会将所选 ID 的数量限制为两个，如果用户选择了全部三个，则会显示警告。

使用 AMP HTML，是否可以从单击的元素获取 ID 或其他属性，附加它们并为锚标记创建 URL？

With AMP HTML, is it possible to get ID or other properties from clicked element, append them and create URL for an anchor tag?

html

javascript

css

frontend

amp-html