Изменение содержимого шаблона во время выполнения

Я хочу создать элемент Polymer, который генерирует вывод списка

<polymer-element name="polymer-list>
  <template>
    <template id="my-repeat" repeat="{{item in listData}}">
      <!-- use content here -->

      <!-- some fix dummy content to see how this is handled -->
      <div id="div_{{item['item']['index']}}">{{item['item']['index']}}</div> 

    </template>
    <content id="content" select="*"></content>
  </template>
  <script type="application/dart" src="polymer_list.dart"></script>
</polymer-element>

и я хочу переместить элементы, предоставленные <content select="*"></content>, внутри тега <template id="my-repeat"> (в позиции <!-- use content here -->), когда инициируется polymer-list (готово, прикреплено, ...).

Мой polymer-list должен использоваться как

<polymer-list id="list" data="{{data}}" on-polymer-select="{{selectAction}}">
  <div class="header">{{item['index']}}</div>
  <div class="item {{item['selected']}}">Index: {{item['index']}}</div>
</polymer-list>

В результате оба <div> должны повторяться для каждого item в data элементом <polymer-list>.

Я старался

var listContent = ($['content'] as ContentElement).getDistributedNodes();
var t = ($['my-repeat'] as TemplateElement);
listContent.forEach((n) => t.append(n.clone(true));
// listContent.forEach((n) => t.content.append(n.clone(true)); // didn't work either

в результате я получаю

<!-- ... -->
<template id="my-repeat" repeat="{{item in listData}}">
  #document-fragment
    <div class="header"></div>
    <div class="item">Index: </div>
</template>
<div id="div_0">0</div>
<div id="div_1">1</div>
<div id="div_0">2</div>
<!-- ... -->

Фиктивное содержимое исправления повторяется в обычном режиме, но динамически добавляемые элементы помещаются в document-fragment, но не повторяются.

Любой намек на манипулирование HTML в <!-- use content here --> во время выполнения был бы замечательным.