从数组中删除项目并将其添加到另一个数组

Question

我向用户显示了一系列包含内容的 div，用户可以从页面中删除 div，这样他们就看不到它了。

我想获取从数组中删除的相同 div 内容，并将其添加到将用于填充下拉列表的另一个数组中。

这就是我所拥有的：

//Remove function
removeCategory(index: number): void {
    this.categories.splice(index, 1);
}
//Array
categories: Array<Item> = [
    new Item(1, 'test1'),
    new Item(2, 'test2')
];
//New Array to add previous removed item
ddoptions: Array<object> = [];

是否可以在 removeCategory 函数中的 splice 之前执行 push 语句？我不确定要传入什么，因为这样做会给我一个错误：

this.ddoptions.push(index);

Answer 1

2020 年更新

随着新ES的规格，你也可以使用解构赋值运算符的数组，这意味着你不必使用上concat还是apply一个push在特定情况下的功能。这实际上是在我最初写这篇文章的时候出现的，但现在更常见了。

this.ddoptions.push(...this.categories.splice(index, 1));

不过从下面的规则仍然适用，使用push和splice发生变异现有阵列，所以concat也许应该仍然可以使用，如果你想不变性。

原答案

您可以直接拼接到 push 方法中，因为 splice 返回已删除的对象。

this.ddoptions.push(this.categories.splice(index, 1)[0]);

splice 方法实际上返回一个被移除元素的数组。在您的情况下，您只删除了一个，以便上述代码有效。如果要删除一个或多个元素，可以使用多种方法将它们添加到第二个数组中。

通过使用 concat 生成一个新数组：

this.ddoptions = this.ddoptions.concat(this.categories.splice(index, 1));

这可能会破坏事情，因为 ddoptions 不再是同一个对象。这取决于您在做什么以及 angular 在做什么。

您可以通过应用 push 原型将数组作为多个参数传递给 push。

[].push.apply(this.ddoptions, this.categories.splice(index, 1));

这样 ddoptions 将保留为相同的数组，并将所有新元素推送到其中。