polymer repeat template "refresh"

Question

Need help with a concept. Building a custom element that displays data from my database. Using a repeat template and it working great. The report is grouped and so each row in the report contains another level of data that is displayed once you drill into a row. So now I want to be able to "refresh" the report data to reflect sort or grouping changes. The report is based off an "indexing" array that points to the actual data displayed. I sort/group the data in the index array, and use this array as the array for the Template Repeat.

<div id="rptbody">
  <template repeat="{{group in groups}}">
    <pmg-group groupid={{group.id}} groupval={{group.groupval}} groupobj={{group.groupobj}}></pmg-group>
  </template>
</div>

So in this example, the groups array is a list of keys to my data. In this example, the groups array is ordered properly so that [0] contains the first index to the data array, and [length-1] contains the last. I have a sort routine that changes the index value in groups, but it does not add or remove items from the groups array.

So my question is after my resort, how do I trigger the template to rescan the groups list? I have found that I can set groups = [], and then reload groups ( groups.push({idx} ) from my master index, and it will update the template, however that seems kind of wasteful to me.

Is there any way to trigger the template to refresh, or rescan the groups array and reorganize the DOM based on the changes in the values?

Solution 1

In the past I've gotten template repeats to refresh like this:

var template = document.querySelector('template'); // Use specific selector here
template.iterator_.updateIteratedValue(); // Force Polymer to refresh template

It's a hack, but it looks like it still works. Here's a jsbin.

Solution 2

Just stumbled on this and found out we have to use the .set method of the Polymer element data model. Not directly found any docs about this but this seems interesting https://www.polymer-project.org/1.0/docs/devguide/data-binding.html#set-path. Would avoid those hacky things because they could change API over the time.