如何在igx网格中以编程方式更新行编辑期间的值

Question

我使用的是Angular 11和当前Ignite UI Agular。

我有一个网格，其中有用户可以编辑的列(名称、活动、类型等(和他们不能编辑的其他列(在其他屏幕中更改的参数、审核列等(：

<igx-grid #grid [data]="data" width="100%" height="500px" [primaryKey]="'ProductID'" [rowEditable]="true">
<igx-column field="ProductName" header="ProductName" [dataType]="'string'"></igx-column>
<igx-column field="UpdatedBy" [dataType]="'string'" [editable]="false"></igx-column>
<igx-column field="UpdatedDate" [dataType]="'date'" [editable]="false"></igx-column>
</igx-grid>

我想知道如何以编程方式修改"；UpdatedBy"；以及"；UpdatedDate"；行编辑完成时的列？

Answer 1

IgxGridComponent的rowEditDone事件可以手动更改当前行对象的目标属性值：

public rowEditDoneHandler(args: IGridEditDoneEventArgs) {
const currRowIndex = this.data.indexOf(args.rowData);
this.data[currRowIndex].UpdatedBy = this.username || 'Anonymous';
this.data[currRowIndex].UpdatedDate = new Date();
this.data = [...this.data];
}

这里还有一个StackBlitz示例演示了这种方法。