将元素从一个数组移动到另一个数组答案

【问题标题】：Moving element from one array into another将元素从一个数组移动到另一个数组
【发布时间】：2019-02-11 08:05:26
【问题描述】：

我尝试制作以下使用ng2-dragula 的Stackblitz。我的问题在于moveback() 和moveto() 函数，它们应该在选择元素时从一个数组移动到另一个数组。我能够检测到哪个元素被选中，但无法完全移动它们（一些元素被留下）。

相关代码：

  moveback() {
    let target = document.getElementsByClassName('target');
    for (let i = 0; i < target.length; i++) {
      if (target[i].className.includes('ex-over')) {
        this.removeClass(target[i], 'ex-over');
        this.data.push({ name: target[i].innerHTML });
        this.target.splice(i, 1);
      }
    }
  }

  moveto() {
    let target = document.getElementsByClassName('data');
    for (let i = 0; i < target.length; i++) {
      if (target[i].className.includes('ex-over')) {
        this.removeClass(target[i], 'ex-over');
        this.target.push({ name: target[i].innerHTML });
        this.data.splice(i, 1);
      }
    }
  }

我发现了两个related(1)、related(2) 问题，它们提出了类似的问题，但在我的情况下不起作用。我的方法是检测元素包含某个类名，然后删除该类并将它们移动到另一个数组并将其从原始数组中删除。但它并没有按预期工作。

【问题讨论】：

标签： javascript angular

【解决方案1】：

如下更新您的for 条件。

for (let i = target.length - 1; i >= 0; i--) {...}

您的逻辑问题是，如果您选择 2nd & 3rd 元素并应用 moveto，那么对于 2nd 元素，它将正常工作。但随后在您实际的this.target 数组中将发生更改。现在3rd 元素将变为2nd，因为您的行this.target.splice(i, 1);。所以当你在for循环迭代中移动3rd元素时，它实际上会移动4th一个。

Check with Updated fiddle Here

【讨论】：