我有一个铁列表,我想提供选择多个项目并立即删除它们的选项。这是我的iron-list
multi-selection
:
<iron-list items="[[users]]" as="user" selected-items="{{selectedUsers}}" multi-selection>
...
</iron-list>
我已经为所选项目数组使用了forEach循环:
_deleteSelected: function(e) {
this.selectedUsers.forEach(function(user) {
var index = this.users.indexOf(user);
if (index != -1) {
this.splice('users', index, 1);
}
}, this);
this.querySelector('iron-list').clearSelection();
console.log(this.selectedUsers);
}
在每个循环中,我计算主项目数组中的项目索引,然后我使用this.splice('items', index, 1)
删除它。循环结束后,我使用此this.querySelector('iron-list').clearSelection();
清除我的选择并继续前进。但是我的迭代失败了,因为无论我选择了多少项,循环似乎只运行一次。如果我只选择一个项目,那么它将被正确删除并刷新列表。但是这里发生了奇怪的事情,因为现在与我刚删除的项目具有相同索引的项目似乎被检查。例如,我有三个项目,我选择第二个并删除它。现在第二个是之前的第三个项目,但是当所选项目数组为空时,似乎没有任何理由进行检查。我猜这些是因为Polymer使用的数组引用。我如何在铁列表选择中解决这种行为?有没有办法只使用拼接而不必清除所选的项目数组?
我的完整组件示例是here。
答案 0 :(得分:0)
所以问题是你在
上运行for循环this.selectedUsers
所以你运行这个数组,然后从this.users删除用户,所以现在铁设置this.selectedUsers为[]因为列表是新的。
我的解决方案是写
this.selectedUsers.slice().forEach(function(user) { ...
因此它创建了新数组,然后这个数组没有改变,因为this.users改变了
答案 1 :(得分:0)
怎么样 -
this.users = this.users.filter(function(u){ return(this.selectedUsers.indexOf(u)== -1); });