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

<script src="http://www.polymer-project.org/polymer.js"></script>

​

<polymer-element name="bt-sortable-list" attributes="drag name list">

  <template>

    <template repeat="{{list}}" id="repeatTemplate" ref="itemTemplate">

      <!-- filled by ref template -->

    </template>

  </template>

  <script>

    Polymer('bt-sortable-list', {

      ready: function() {

        var t = document.createElement('template');

        t.id = 'itemTemplate';

        t.innerHTML = this.innerHTML;

​

        this.list = [{name: 'Item 1', id: 'item1'},

                     {name: 'Item 2', id: 'item2'},

                     {name: 'Item 3', id: 'item3'}];

​

        this.shadowRoot.appendChild(t);

      }

    });

​

  </script>

</polymer-element>

​

<bt-sortable-list>

  <li>Name: {{name}}</li>

</bt-sortable-list>