使用 [src] 绑定更改图像 src？ （电子邮件放大器）

Question

在 amp-bind Amp for Email 文档页面上，它显示了将 [src] 绑定到 amp-img 以更改图像源路径的示例（一个稍微复杂的示例）：

<amp-state id="myAnimals">
  <script type="application/json">
    {
      "dog": {
        "imageUrl": "/img/dog.jpg",
        "style": "greenBackground"
      }
    }
  </script>
</amp-state>

<!-- Or change an image's src with the [src] binding. -->
<amp-img width="300" height="200" src="/img/dog.jpg"
    [src]="myAnimals[currentAnimal].imageUrl">
</amp-img>

但是，当我在 Playground 中验证时，我得到： 属性“[src]”可能不会出现在标记“AMP-IMG (AMP4EMAIL)”中。

我正在尝试对 Carousel 组件 (type="slides") 执行类似操作，当我单击下一张/上一张幻灯片时，我希望更改电子邮件中其他位置的副本/图像。虽然我可以更改副本，但我似乎无法为图像做同样的事情。

是否无法使用 Amp for Email 的 amp-bind 组件更改图像源路径？有解决办法吗？

Answer 1

Vadim，您可以通过 amp-mustache 使用模板来修改 amp-img 的 src 属性。例如

<amp-list ...>
...
 <template type="amp-mustache">
    <div class="products">
        <amp-img width="150"
               height="100"
               alt="{{name}}"
               src="{{img}}"></amp-img>
        <p class="name">{{name}}</p>
        <p class="star">{{{stars}}}</p>
        <p class="price">{{price}}</p>
    </div>
</template>

...

我不记得为什么在 src 上绑定是不可能的，尽管安全似乎是可能的答案。所以不幸的是，如果您注意到模板仅在嵌套在 amp-form 或 amp-list 组件中时适用。如果有足够令人信服的用例允许在这些组件之外支持它，那么请随时创建功能请求，我们将非常乐意与您一起定义需求和实施更改。谢谢