Как редактировать ввод текста в списке

У меня есть список полей для комментариев и кнопок, которые идут к каждому полю. Когда пользователь нажимает кнопку «Изменить», я хочу, чтобы было включено только это конкретное текстовое поле. Когда я нажимаю «Сохранить» или «Отменить», я хочу, чтобы текстовое поле было скрыто, а «

Вот мой ng-шаблон, где я пытаюсь отслеживать по индексу

         <ng-template #item let-item let-i = "index">
           <textarea [disabled] = "IsDisabled(i)" [(ngModel)] = "item.commentText" nz-input rows = "4"></textarea>
             <nz-form-item>
              <button nz-button nzType = "primary" [nzLoading] = "submitting" (click) = "openEdit(i)">Edit Comment</button>
               <button (click)=updateCommentsById(item, index)>                                    
                Save Comment</button>
              </nz-form-item>
              </nz-form-item>
           </ng-template>



async updateCommentsById(item, index) {
        console.info(item, index);

}
openEdit(index){
//Open this list item for edit
}

 IsDisabled(index, disableMe = true) {
    return disableMe;
}

editCommentClicked(index) {
    this.IsDisabled(index, false);
}

cancelCommentClicked(index) {
    this.IsDisabled(index, true);
}

Как вы видите в этом списке, каждая строка имеет текстовое поле. Когда пользователь нажимает на кнопке «Редактировать» я хочу, чтобы текстовое поле было включено только для этой строки. Когда пользователь нажимает кнопку «Отмена» или «Сохранить», я хочу, чтобы соответствующие действия были прикреплены только к этой строке.

Как я могу использовать индекс для редактирования и сохранения каждой строки