<script src="//www.polymer-project.org/components/platform/platform.js"></script>

<link rel="import" href="//www.polymer-project.org/components/polymer/polymer.html">

​

<my-element data='["alpha", "beta", "gamma"]'></my-element>

​

<polymer-element name="my-element" attributes="data">

<template>

  <ul id="my_data" on-tap="{{dataTap}}"></ul>

</template>

<script>

  Polymer('my-element', {

    data: [],

    dataSelected: function(selectedText) {

      console.log('dataSelected: ' + selectedText);

    },

​

    dataChanged: function() {

      var data = this.data;

      for (var i = 0; i < data.length; i++) {

        var li = document.createElement('li');

        li.innerText = data[i];

        this.$.my_data.appendChild(li);

      }

    },

    dataTap: function(e) {

      if (e.target.localName === 'li') {

        this.dataSelected(e.target.innerText);

      }

    }

  });

</script>

</polymer-element>