Question

我使用Angular 6。我需要在FormArray中创建一个重复的元素。我需要创建方法createACopyAtIndex(indexNumber: number)，以便当一个人通过indexNumber == 3时，将创建一个重复元素，并将索引分配为4。新数组将具有两个重复元素：3和4。 / p>

createACopyAtIndex(indexNumber: number) {
  console.log(indexNumber);
  var myArray = <FormArray>this.invoiceForm.controls['test'].value;
  this.invoiceForm.controls['test'].patchValue(this.getDuplicatedArrayAtIndex(myArray, indexNumber));
}

// this method returns a new array newArr
// this new array contains two duplicate elements: indexNumber and indexNumber + 1  
getDuplicatedArrayAtIndex(arr, indexNumber) {
  var temp = arr[indexNumber];
  var newArr = arr.splice(indexNumber, 0, temp);
  return newArr;
};

但是什么也没发生。没错没有变化

Answer 1

splice既不返回新数组也不返回旧突变数组。它从arr中删除已删除的项目。您的情况是一个空数组

如果要返回指定索引处重复的新数组，则可以使用slice获取原始数组的副本。然后使用splice插入指定的索引。然后，返回新数组

function getDuplicatedArrayAtIndex(arr, indexNumber) {
  var newArr = arr.slice();
  newArr.splice(indexNumber, 0, arr[indexNumber])
  return newArr
};

console.log(getDuplicatedArrayAtIndex([0,1,2,3,4], 2))

另一种选择是slice数组的两个部分，并在索引处插入一个新项，然后使用spread syntax

合并它们

const getDuplicatedArrayAtIndex = 
  (arr, i) => [...arr.slice(0, i + 1), arr[i], ...arr.slice(i + 1)]

如何在数组的索引处插入重复项？

1 个答案: