Polymer - start index for dom-repeat

Question

I am displaying two arrays - one after another as unordered list ( ul ) using Polymer's dom-repeat :

<ul>
  <template is="dom-repeat" items="{{array1}}" index-as="position_id">
    <li on-tap="select1" class$="{{_selectedStyle(selectedId, position_id)}}">
      {{item.fileName}}
    </li>
  </template>
  <template is="dom-repeat" items="{{array2}}" index-as="position_id">
    <li on-tap="select2" class$="{{_selectedStyle(selectedId, position_id}}">
      {{item.fileName}}
    </li>
  </template>
</ul>
...
_selectedStyle: function (selectedPosId, posId) {
  if (selectedPosId && posId){
    return (selectedPosId === posId) ? "selected" : "";
  }
}

I want to apply class on the selected item, but obviously it doesn't work properly because for both dom-repeat templates selectedId and position_id are the same (both starts from 0). Ideally would be to have offset on the second dom-repeat template, but it seems this feature is not supported. What would be the best workaround in this case?

Answer 1

Just pass also the offset (length of array1 ) and add them in _selectedStyle() (see comments below):

<li on-tap="select2" class$="{{_selectedStyle(selectedId, position_id, array1.length}}">
  {{item.fileName}}
</li>