Search code examples
polymerweb-component

Render table rows with Polymer's <core-list>


I was trying to use <core-list> to render rows for a table like:

<table>
  <tbody>
    <core-list data="...">...</core-list>
  </tbody>
</table>

Unfortunately, it's not that simple. <tbody> can't contain <core-list> element so it's simply ignored by the browser (or at least I assume that's the reason). I thought this is the most obvious use case for <core-list> but the official documentation doesn't mention using it with tables at all which is very surprising for me.

Maybe I'm just blind but I wasn't able to google anything so I'm wondering if I really can't use <core-list> in this way or my approach isn't right.


Solution

  • It seems the only way is really to use just <div>s and style them to look like a table because of the reasons described in the original question.

    This applied to Polymer 0.5 but the issue will probably be the same with Polymer 1.0 as well.