How to use Paper-item in another item

[rhys.m....@gmail.com]

Hey!

If I had a similar list item to the Polymer Shop:

https://github.com/Polymer/shop/blob/master/src/shop-list-item.html

..and I wanted to use a paper-icon-item, would the idea be to put the paper-icon-item inside shop-list-item?

Thanks!

[Daniel Llewellyn]

The shop example is built in a way that shows a working example, but some of the elements are designed to work with only their siblings. That includes the shop-list and shop-list-item elements. Unfortunately it means you cannot modify much without hacking it about directly.

If you just want to replace the image on an item then the object which defines each item can include an `image` attribute. This attribute will be passed to shop-image which determines the image display. The attribute itself should be a single string with the URL to the image you want to display.

To create your own custom list and list-item elements which allow for composability you can attempt something like http://stackoverflow.com/questions/34645114/polymer-dom-repeat-binding-to-content/34751655#34751655 however I don't understand that method well enough to advise usage.

HTH,

Dan.

[Daniel Llewellyn]

On Sun, 27 Nov 2016 at 21:50 Daniel Llewellyn <dan...@bowlhat.net> wrote:

To create your own custom list and list-item elements which allow for composability you can attempt something like http://stackoverflow.com/questions/34645114/polymer-dom-repeat-binding-to-content/34751655#34751655 however I don't understand that method well enough to advise usage.

 

Following-up to myself, I've created a codepen which shows how to define a list and list-item element that allows composition of inner elements: http://codepen.io/diddledan/pen/bBrxZR

Dan.

[rhys.m....@gmail.com]

Thanks Dan! I got to that stage myself with the composition. It was more so that I wanted to use the exact paper-item-icon but as my own component, so I have just put it inside for now.