Как склеить элемент из массива в angular 7, не нарушая основной массив

Question

Моя ссылка на стек (Пожалуйста, не используйте мой пользовательский интерфейс. Я создал его только для понимания концепции)

Когда я выбираю «Выбрать все», а затем начинаю отменять выбор A, B, ... элементы сращиваются из mainList. Но в моем файле машинописи я склеил элемент только из фильтрованного списка, а не из моего основного списка. Пожалуйста, объясните, как удаление элемента из FilterList также удаляет его из mainList. Я что-то здесь не так делаю? Или, если это функциональность, которую нельзя изменить, как я могу зарезервировать свой mainList без нарезки.

Я проверил ссылки ниже. Но они не работали

• Клонирование массива в Javascript / Typescript

• Копировать массив объектов в angular 2

Answer 1

this.filteredList = this.mainList.map(ele=>{return ele});

после этого выполните все операции с фильтрованным списком, поскольку это сделает глубокую копию массива

Answer 2

Когда вы присваиваете this.mainList для this.filteredList, вы копируете ссылку . Таким образом, любые действия, выполняемые с одним списком, влияют на другой.

Вместо этого вы должны сделать копию массива, используя slice.

this.filteredList=this.mainList.slice();

Примечание. Ссылки на объекты внутри массивы все те же, поэтому любые действия, выполняемые с внутренними объектами, будут отражены в обоих списках.

const arr1 = [1,2,3];
const arr2 = arr1;

arr2[1] = 4;

console.log('update reference');
console.log(arr1, arr2);

const arr3 = arr1.slice();
arr3[1] = 2;

console.log('update slice');
console.log(arr1, arr3);

РЕДАКТИРОВАТЬ

Хотя это одна часть вашей проблемы, вы все равно копируете ссылку на основной массив в другие части кода.

Я бы рекомендовал начать снова с другого подхода. Вот моя очень упрощенная версия, хотя и без функции «Выбрать все»: https://stackblitz.com/edit/angular-ihkbfn

Answer 3

Пожалуйста, попробуйте с Spread Operator в TypeScript, я думаю, что это решит вашу проблему.

В TypeScript оператор распространения (в форме многоточия) можно использовать для инициализации массивов и объектов из другого массива или объект. Вы также можете использовать оператор распространения для деструктуризации объекта.

Только один пример: инициализировать массивы другого массива, а затем нарезать этот новый массив с курсором

Инициализировать массивы другого массива

Вы можете использовать оператор распространения для создания массивов из существующих массивов заданным способом.

let origArrayOne = [ 1, 2, 3];                          //1,2,3
let origArrayTwo = [ 4, 5, 6];                          //4,5,6

//Create new array from existing array
let copyArray = [...origArrayOne];                      //1,2,3

//Create new array from existing array + more elements
let newArray `enter code here`= [...origArrayOne, 7, 8];             //1,2,3,7,8 

//Create array by merging two arrays
let mergedArray = [...origArrayOne, ...origArrayTwo];   //1,2,3,4,5,6