2013-12-19 14 views
1

Я хочу построить полимерный элемент, который формирует выходной списокИзменения во время выполнения

<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 --> во время выполнения будет отличным.

ответ

1

К сожалению, вы можете вставить вам контент только один раз, как указано в спецификации (http://www.w3.org/TR/2013/WD-components-intro-20130606/#insertion-points):

точки вставки позволяет вам заказана или выборочно пропустить рендеринг детей-хозяина, но они не будут вызывать то, чтобы быть вынесены несколько раз. Порядок деревьев определяет, когда каждый из этих элементов принимает пропуск при выборе детей. Как только ребенок выбран для отображения в одной точке вставки, он не может быть заявлен другим, и именно поэтому раскрывающийся детали-декоратор только один раз отображает сводку.

Смежные вопросы