首页 > 解决方案 > 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 键,我没有得到任何输出。你能帮我找出问题吗?

标签: angularprimengprimeng-turbotable

解决方案


我通过删除和添加解决(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>

推荐阅读