需要按两次复选框才能使 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);

对于对象和数组，您需要始终以可观察的方式进行更改。查看此 link 了解更多详情： https://www.polymer-project.org/2.0/docs/devguide/model-data#array-mutation

DEMO

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

Checkbox needs to be pressed twice for onclick to work

html

javascript

checkbox

arraylist

polymer