聚合物重复模板“刷新”答案

【问题标题】：polymer repeat template "refresh"聚合物重复模板“刷新”
【发布时间】：2014-07-17 18:35:41
【问题描述】：

在概念方面需要帮助。构建一个自定义元素来显示我的数据库中的数据。使用重复模板，效果很好。报告是分组的，因此报告中的每一行都包含另一个级别的数据，一旦您深入到一行，就会显示这些数据。所以现在我希望能够“刷新”报告数据以反映排序或分组更改。该报告基于指向实际显示数据的“索引”数组。我对索引数组中的数据进行排序/分组，并将该数组用作模板重复的数组。

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

所以在这个例子中，groups 数组是我的数据的键列表。在这个例子中，groups 数组被正确排序，[0] 包含数据数组的第一个索引，[length-1] 包含最后一个索引。我有一个排序例程可以更改组中的索引值，但它不会在组数组中添加或删除项目。

所以我的问题是在我的度假胜地之后，如何触发模板重新扫描组列表？我发现我可以设置groups = []，然后从我的主索引重新加载组（groups.push({idx}），它会更新模板，但这对我来说似乎有点浪费。

有什么方法可以触发模板刷新，或者重新扫描groups数组，根据值的变化重新组织DOM？

【问题讨论】：

一个有点相关的问题：stackoverflow.com/questions/23706775/…

标签： templates polymer

【解决方案1】：

In the past 我已经让template repeats 像这样刷新：

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

这是一个 hack，但看起来它仍然有效。 Here's a jsbin.

【讨论】：

【解决方案2】：

偶然发现我们必须使用 Polymer 元素数据模型的 .set 方法。没有直接找到任何关于此的文档，但这似乎很有趣https://www.polymer-project.org/1.0/docs/devguide/data-binding.html#set-path。会避免那些 hacky 的东西，因为它们可能会随着时间的推移改变 API。

【讨论】：