javascript - 需要按两次复选框才能使 onclick 起作用

Question

我有一个由 DOM 重复组成的复选框:

<paper-listbox id="afgerondtitel">
      <paper-item id="check1">Afgerond</paper-item>
      <template is="dom-repeat" items="{{gerechten}}" count="[[num_box]]">
      <paper-item id="item_[[index]]"><paper-checkbox checked="{{item.checked}}" on-click="click"></paper-checkbox></paper-item>
      </template>
    </paper-listbox>

然后我尝试使用此函数从 ArrayList 中删除一个变量:

click(){
        for(var i = this.gerechten.length - 1; i >= 0; i--) {
          if(this.gerechten[i].checked) {
            this.gerechten.splice(i, 1);
          }
          }
      }

问题是需要按两次复选框(选中然后取消选中)才能从列表中删除变量。

我想选中该复选框，以便代码立即从列表中删除 de variabele。

提前致谢!

Answer 1

实际上，它是在第一次点击时从数组中删除。但是您需要使用 Polymer 方式 array.splice 才能观察到变化，因此请使用:

 this.splice('gerechten', i, 1); // in order to observable changes in dom-repeat. 

代替:

 this.gerechten.splice(i, 1);

对于对象和数组，您需要始终以可观察的方式进行更改。检查此链接以获取更多详细信息: https://www.polymer-project.org/2.0/docs/devguide/model-data#array-mutation

DEMO