Important: this component does not support your currently selected format ads!
amp-action-macro
Creates reusable actions.
Required Script | <script async custom-element="amp-action-macro" src="https://cdn.ampproject.org/v0/amp-action-macro-0.1.js"></script> |
Examples | amp-action-macro.html |
Overview
The amp-action-macro
component allows for the creation of reusable actions.
Example
<amp-action-macro id="closeNavigations" execute="AMP.setState({nav1: 'close', nav2: 'close})" ></amp-action-macro>
<button on="tap:closeNavigations.execute()">Close all</button> <div on="tap:closeNavigations.execute()">Close all</div>
<!-- You can provide arguments in the macro. --> <amp-carousel id="carousel" ...>...</amp-carousel> <amp-action-macro id="carousel-macro" execute="carousel.goToSlide(index=foo), carousel.goToSlide(index=bar)" arguments="foo, bar" ></amp-action-macro>
<button on="tap:carousel-macro.execute(foo=1, bar=2)"> Go to slide 1 then 2 </button>
Attributes
id
Used to uniquely identify the action. This is referenced in an action invocation.
execute
The action to invoke. Any valid amp action is allowed here. See actions and events in AMP.
e.g.
<amp-action-macro id="navigate-action" action="AMP.navigateTo('http://www.ampproject.org')" ></amp-action-macro> <amp-action-macro id="refresh-amp-list" execute="ampList.refresh()" ></amp-action-macro> <amp-list id="ampList" src="...">...</amp-list> <button on="tap:navigate-action"></button> <button on="tap:refresh-amp-list"></button>
arguments
Used to define arguments that can be used in the called invocation and substituted in the amp action macro call.
You've read this document a dozen times but it doesn't really cover all of your questions? Maybe other people felt the same: reach out to them on Stack Overflow.
Go to Stack Overflow Found a bug or missing a feature?The AMP project strongly encourages your participation and contributions! We hope you'll become an ongoing participant in our open source community but we also welcome one-off contributions for the issues you're particularly passionate about.
Go to GitHub