如何添加插槽重複DOM聚合物2

Question

我想創建一個佈局元素，所以我寫這樣

<template> 
 
     <div class="row"> 
 
      <template is="dom-repeat" items="[[cols]]"> 
 
       <div class$="col-[[item]]"> 
 
        <slot id="id[[index]]" name="id[[index]]">no value</slot> 
 
       </div> 
 
      </template> 
 
     </div> 
 
    </template>

，並在html網頁文件，我使用的模板這個組件是這樣的：

<tcpc-row> 
 
     <span slot="id0">cc id-tcpc-col-0 </span> 
 
     <span slot="id1">cc id-tcpc-col-1 </span> 
 
     <span slot="id1">cc id-tcpc-col-3 </span> 
 
    </tcpc-row>

，但我的結果是不正常，當我寫的模板不重複就可以了，就像這樣：

<template> 
 
    <div class="row"> 
 
     <div class="col-3"> 
 
      <slot name="id0"></slot> 
 
     </div> 
 
     <div class="col-3"> 
 
      <slot name="id1"></slot> 
 
     </div> 
 
     <div class="col-3"> 
 
      <slot name="id2"></slot> 
 
     </div> 
 
     <!--<template is="dom-repeat" items="[[cols]]"> 
 
      <div class$="col-[[item]]"> 
 
       <slot id="id[[index]]" name="id[[index]]">no value</slot> 
 
      </div> 
 
     </template>--> 
 
    </div> 
 
</template>

有有一些辦法在重複添加插槽？

Answer 1

嘗試插入<div class="row">。