时间戳

首页 > 解决方案 > AMP 电子邮件附加动态参数

amp-html - AMP 电子邮件附加动态参数

问题描述

在 AMP 中，我想根据用户选择动态更改链接参数。例如，如果用户选择选项 1 ，我需要附加一个带有 option=1 的参数。这种实现是可能的还是有另一种方法可以做到这一点。我需要附加的原因是我想用这个参数加载 url。使用参数提交的表单不适用于此实现。

<amp-selector layout="container"  on="select: AMP.setState({
    currentSelection: event.targetOption,

  })" class="sample-selector" >
    <amp-img 
    src="https://amp.dev/static/img/docs/tutorials/firstemail/photo_by_caleb_woods.jpg" 
    width="50" height="50" 
    option="neutral" 
    ></amp-img>
    <amp-img 
      src="https://amp.dev/static/img/docs/tutorials/firstemail/photo_by_craig_mclaclan.jpg" 
      option="good" 
      width="50" height="50" option="good"></amp-img>
  </amp-selector>


  <button>
    <a href="https://mysite/page.jsp?param=234" 
      data-amp-addparams="response=currentSelection"
      >Click Button</a></button>

我想将 currentSelection 中的值作为参数附加。

标签： amp-htmlamp-email

解决方案

由于无法[href]在 AMP 中绑定到电子邮件并且 URL 替换也不支持，因此实现此目的的一种方法是在您的标记中包含多个链接，并[hidden]根据您的选择通过绑定来显示/隐藏它们：

<amp-selector layout="container"  on="select: AMP.setState({
    currentSelection: event.targetOption,

  })" class="sample-selector" >
    <amp-img 
    src="https://amp.dev/static/img/docs/tutorials/firstemail/photo_by_caleb_woods.jpg" 
    width="50" height="50" 
    option="neutral" 
    ></amp-img>
    <amp-img 
      src="https://amp.dev/static/img/docs/tutorials/firstemail/photo_by_craig_mclaclan.jpg" 
      option="good" 
      width="50" height="50" option="good"></amp-img>
  </amp-selector>


    <a href="https://mysite/page.jsp?param=neutral" 
      [hidden]="currentSelection != 'neutral'"
      >Click Button</a>

    <a href="https://mysite/page.jsp?param=good" 
      [hidden]="currentSelection != 'good'"
      >Click Button</a>

推荐阅读