聚合物:更改检查属性后未更新的复选框元素

Question

我在聚合物中编写了一个示例程序。我有一个模板，如下所示：

<template is="dom-repeat">
   <li class="clearfix title-container">
      <input type="checkbox" checked="{{item.checked::change}}" class="checkbox-container float--left" />
      <label class="label-container">{{item.id}}</label>
   </li>
 </template>

我有一个按钮，如下所示，单击哪个函数f1（）称为：

<button on-click="f1">Save</button>

最初检查了所有复选框。用户可能会取消选中某些复选框，然后单击按钮。F1（）收集用户已检查的所有元素。执行F1后，我希望再次检查所有复选框。F1（）的代码如下：

//Collect all the selected items in a separate array.
//Revert unchecked checkboxes to checked.
f1: function() {
  newIndex = 0;
  for (index = 0; index < this.dataArray.features.length; index++) {
    if (this.dataArray.features[index].checked) {
      this.newDataArray.selectedElements[newIndex++] = this.dataArray.features[index];
    } else {
      this.dataArray.features[index].checked = true;
    }
  }
}

以下是dataarray元素的定义（我只是在控制台中打印它）：

//The dataArray when printed in a console
{
  type: "FeatureCollection",
  features: Array(4)
}
features: Array(4) 0: {
  type: "Feature",
  checked: true
}
1: {
  type: "Feature",
  checked: true
}
2: {
  type: "Feature",
  checked: true
}
3: {
  type: "Feature",
  checked: true
}

我面临的问题是，在F1（）执行对检查属性的更改后，即使我分配了要检查的数组中的所有值，也不会反映在UI中。我已经阅读了有关子专业的未直接反映的信息，但我不明白如何在此处使用NotifyPath（）或如何使用阵列突变方法。任何帮助都将不胜感激。

Answer 1

您必须使用数组突变方法。。。。。。。。。。。。。。。。。。。。。。。。。。>