CODEWITHSUNDEEP
javascripthtmlpolymerpolymer-1.0
anivas
anivas

Reputation: 6547

Polymer content selection dom-repeat

I have the following polymer element.

<dom-module id="my-element">
    <template is="dom-repeat" items="[[items]]">
        <paper-item>
            <span>[[item]]</span>
        </paper-item>
    </template>
</dom-module>

Expected to be used as 

<my-element items="[[items]]">
</my-element>

This will repeat the hardcoded span. But is it possible for the host to supply the rendering component as well. So instead of span they can provide whats going to be repeated.

<my-element items="[[items]]">
    <div>
        <div>[[item.name]]</div>
        <div>[[item.address]]</div>
    </div>
</my-element>

Tried content selection doesn't seem to repeat the selected element.

<dom-module id="my-element">
    <template is="dom-repeat" items="[[items]]">
        <paper-item>
            <content select="element"></content>
        </paper-item>
    </template>
</dom-module>
<my-element items="[[items]]">
    <div class="element">
        <div>[[item.name]]</div>
        <div>[[item.address]]</div>
    </div>
</my-element>

Appreciate any help or directions on this.

Upvotes: 2

Views: 248

Answers (1)

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657148

If multiple <content> elements with the same select value are added all elements are projected to the first element with a matching selector. You need to find a different strategy.

Upvotes: 2

Related Questions