0

On the amp-bind Amp for Email documentation page, it shows an example (A slightly more complex example) of binding [src] to amp-img to change an image source path:

<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>

However when I validate in Playground I get: The attribute '[src]' may not appear in tag 'AMP-IMG (AMP4EMAIL)'.

I'm trying to do something similar with the Carousel component (type="slides"), where as i click to the next/prev slide I want copy/image located elsewhere in the email to change. While I can get the copy to change, it doesn't seem I can do the same for the image.

Is it not possible to change an image source path using the amp-bind component for Amp for Email?? Is there a workaround?

4

1 回答 1

0

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 组件中时适用。如果有足够令人信服的用例允许在这些组件之外支持它,那么请随时创建功能请求,我们将非常乐意与您一起定义需求和实施更改。谢谢

于 2019-10-02T13:25:38.507 回答