ag-grid angualr Я хочу дублировать выбранные данные строки в той же сетке, т.е. я хочу скопировать и пометить выбранную строку нажатием кнопки в той же сетке

Question

В Ag-grid angular, у меня есть строка клона кнопки, я выберу строку в сетке и нажму на строку клона, она должна создать такую ​​же строку еще раз в указанном индексе, я смог добиться этого, используя следующий код

в app.ts ::

клон Row () {

var selectedRowsIndex = this.gridOptions.api.getSelectedNodes ();

     var index = selectedRowsIndex[0].rowIndex
var selectedRows = this.gridOptions.api.getSelectedRows();
const temp =  [...selectedRows] 
for (var i = 0; i < selectedRows.length; i++) {
  temp[i].B_CLONE = true;
  temp[i].SNO = 3;

}
this.gridOptions.api.insertItemsAtIndex(++index,temp)

}

<button class="btn btn-info ml-3" (click)="cloneRow()">Clone Row</button>

<button class="btn btn-info ml-3" (click)="cloneRow()">Clone Row</button>

Проблема, с которой я столкнулся, была после клонирования строки (insertItemsAtIndex)

1. существующая строка также изменяется с новой строкой клона, если добавьте любое значение, т. е. s.no в gird

2. , если я отредактирую любую из 2 дублированных строк и изменим любое значение в любой ячейке строки, изменяющейся n, и обе строки изменяются.

я хочу, чтобы две строки не зависели от их значений

Я прилагаю короткий экран для простоты понимания.

исходная сетка перед клоном

сетка после клона

сетка после клона, изменяющая значение ячейки в одной строке

Answer 1

Вам необходимо глубоко клонировать и назначить объект temp следующим образом:

this.gridOptions.api.insertItemsAtIndex(++index,Object.assign({}, temp));

Вместо Object.assign({}, temp) вы также можете клонировать объект следующим образом (старый способ клонирования):

this.gridOptions.api.insertItemsAtIndex(++index,JSON.parse(JSON.stringify(temp)));