Я настраиваю таблицу с данными пользователей.
Я использую Angular и PrimeNG.
Как я могу вернуть событие при редактировании строки и вернуть новые отредактированные данные или флаг?
Есть ли другой способ уведомить, что строка изменена?
Используя эту таблицу: https://www.primefaces.org/primeng/#/table/edit
Пример:
Перед редактированием ->
{"name":"Mario","surname":"Rossi","mail":"[email protected]", "phone":"003900000"}
После редактирования ->
{"name":"Mario","surname":"Rossi","mail":"[email protected]", "phone":"003900000", "flag":"edit"}
Заранее спасибо :)
я уже поставил эти обратные вызовы, но они не работают
(onEdit) = "onEdit($event)" (onEditComplete) = "onEditComplete($event)"
<p-table [value] = "users" >
<ng-template pTemplate = "header">
<tr>
<th>Nome</th>
<th>Cognome</th>
<th>Email</th>
<th>Cellulare</th>
<th>Delete</th>
</tr>
</ng-template>
<ng-template pTemplate = "body" let-user>
<tr>
<td pEditableColumn styleClass = "col-button">
<p-cellEditor>
<ng-template pTemplate = "input">
<input pInputText type = "text" [(ngModel)] = "user.name">
</ng-template>
<ng-template pTemplate = "output">
{{user.name}}
</ng-template>
</p-cellEditor>
</td>
<td pEditableColumn>
<p-cellEditor>
<ng-template pTemplate = "input">
<input pInputText type = "text" [(ngModel)] = "user.surname" required>
</ng-template>
<ng-template pTemplate = "output">
{{user.surname}}
</ng-template>
</p-cellEditor>
</td>
<td>
<p-cellEditor>
<ng-template pTemplate = "input">
<input pInputText type = "text" [(ngModel)] = "user.mail" required>
</ng-template>
<ng-template pTemplate = "output">
{{user.mail}}
</ng-template>
</p-cellEditor>
</td>
<td pEditableColumn>
<p-cellEditor>
<ng-template pTemplate = "input">
<input pInputText type = "text" [(ngModel)] = "user.phone" required>
</ng-template>
<ng-template pTemplate = "output">
{{user.phone}}
</ng-template>
</p-cellEditor>
</td>
<td><button text = "Elimina Utente" type = "button" pButton (click) = "removeUser(user)" icon = "pi pi-times" class = "ui-button-danger" title = "Elimina Utente"></button>
</td>
</tr>
</ng-template>
</p-table>
Согласно разделу Редактирование ячеек в документация:
If you require the edited row data or the selected field in the onEditInit, onEditComplete, and onEditCancel events, bind the row data to the pEditableColumn directive and the field to the pEditableColumnField directive.
<td [pEditableColumn] = "rowData" [pEditableColumnField] = "'year'">