angular - onEditComplete 不起作用
问题描述
我有一个包含可编辑列的p 表。我需要做的是当字段Year的值发生变化时,我可以获取并使用它。首先,我希望能够在控制台上显示它。为此,我使用函数onEditComplete
HTML 文件:
<p-table [columns]="cols" [value]="cars">
<ng-template pTemplate="header" let-columns>
<tr>
<th>ID</th>
<th>Year</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-rowData let-columns="columns">
<tr>
<td pEditableColumn>
<p-cellEditor>
<ng-template pTemplate="input ">
<input type="text" [(ngModel)]="rowData.id">
</ng-template>
<ng-template pTemplate="output">
{{rowData.id}}
</ng-template>
</p-cellEditor>
</td>
<td pEditableColumn [pEditableColumn]="rowData"
[pEditableColumnField]="'year'" (onEditComplete)="onEditComplete(rowData)">
<p-cellEditor>
<ng-template pTemplate="input">
<input type="text" [(ngModel)]="rowData.year" required>
</ng-template>
<ng-template pTemplate="output">
{{rowData.year}}
</ng-template>
</p-cellEditor>
</td>
<td pEditableColumn>
</tr>
</ng-template>
</p-table>
TS 文件:
onEditComplete (event) {console.log(event);}
但是通过更改Year字段然后按 Tab 或 Enter 键,我没有得到任何输出。你能帮我找出问题吗?
解决方案
我通过删除和添加解决(onEditComplete)="onEditComplete(rowData)"
了td
这个(onEditComplete)="onEditComplete($event)"
问题p-table
:
<p-table [columns]="cols" [value]="cars" (onEditComplete)="onEditComplete($event)">
//........
<td pEditableColumn [pEditableColumn]="rowData" [pEditableColumnField]="'year'" >
//...
</p-table>
推荐阅读
- python - TorchServe MAR 每个模型有多个 Python 文件
- reactjs - React-bootstrap 删除确认模式在单击按钮时立即消失
- c# - 如何确保在主线程上记录或重新抛出杀死任务的未处理异常?
- python - 类似于 relplot 和 displot 的东西,用于使用 Seaborn 绘制箱线图
- java - Spring Data Repository 扩展 Custom Repository 时出现 BeanCreationException
- c - 为 UDP 协议创建套接字的协议号
- php - 如何从 laravel 中的 mysql 数据库正确加载图像 blob?
- amazon-web-services - Terraform Cloudwatch 警报 - 维度配置
- laravel - 如何在 Laravel 中编写解耦的 PaymentMethod Provider
- ansible - Ansible:评估条件时出错