Обновление строки таблицы с использованием модальной формы отправки

Question

Я работаю над обновлением строки таблицы.У меня есть таблица со строками данных и кнопка редактирования.Когда я нажимаю кнопку редактирования, открывается модальное окно, содержащее все значения строк.

Моя проблема заключается в том, что, когда я изменяю этот модал, моя строка также изменяется из-за ngModel.

Я не хочу, чтобы мои данные таблицы менялись, даже если я изменяю в моём модальном окне, а затем при нажатии кнопки обновления только это должно быть изменено.

Я не уверен, как это исправить.

Любая помощь, пожалуйста ..

<tbody>
    <tr *ngFor="let tableRow of this.tableData">
        <td *ngFor="let tableHeader of this.tableFieldOrder">{{tableRow[tableHeader]}}</td>
        <td class="btn-edit"><a (click)="editPopUp(tableRow)">Edit</a></td>
    </tr>
</tbody>

<app-dialog [showDialog]="modalOn" [titleText]="modalTitle" [hideNegative]="true" [hidePositive]="true"
(closeButtonClicked)="this.resetModal()" [level]="1">
<h4>Product Detail</h4>
<form [formGroup]="maintenanceProductTargetForm" *ngIf="maintenanceProductTargetForm"
    (ngSubmit)="editMaintenanceProduct(maintenanceProductTargetForm.value)">
    <table class="table table-bordered">
        <thead>
            <tr>
                <th scope="col">Product Code Clip</th>
                <td>
                    <input 
                        type="text" 
                        class="form-control" 
                        formControlName="product_code" 
                        name="product_code_clip"
                        placeholder="Enter Product Code Clip" 
                        [(ngModel)]="editProductData.product_code" />
                </td>
            </tr>
        </thead>