We've mentioned amp-bind
a few times in the previous chapters; now it's time to see it in action. The amp-bind
component makes it possible to program custom interactivity into your pages. You can think of it as a programming layer for your AMP pages, sort of a JavaScript-lite.
You can add amp-bind
to your pages with the following script:
<script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
There are three parts to amp-bind
: stateful data, expressions, and data-binding. With amp-bind
, element properties can be linked to custom JavaScript-like expressions which can reference custom state variables. This needs some explanation, so let's expand on it now.