angular - 如何在 igx-grid 中的行编辑期间以编程方式更新值?
问题描述
我正在使用 Angular 11 和当前的Ignite UI Agnular。
我有一个网格,其中包含用户可以编辑的列(名称、活动、类型等)和其他他们不能编辑的列(在其他屏幕、审计列等中更改的参数):
<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”列?
解决方案
可以处理rowEditDone
事件以手动更改当前行对象的目标属性值:IgxGridComponent
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 示例演示了这种方法。
推荐阅读
- python - 如何使用 2 个分隔符的正则表达式拆分字符串,但将分隔符保留在 Python 中?
- node.js - 在 Heroku (react app) 上部署 Docker 镜像的问题
- java - 在 HttpsURLConnection 中传递 pdf 文件
- ios - NavigationBar 中的自定义 TitleView
- reactjs - 页面加载时,调度未在 useEffect 内触发
- angular - Angular 10:CommonJs 和 AMD 依赖可能导致优化救助,hotkeys.js 依赖于“mousetrap”
- javascript - 在生成的 GUID 值上链接 json 对象
- python - numpy 3d数组中的for循环
- android - 更新 android studio & gradle 插件后未配置 Kotlin
- java - 如何检查是否正在调用特定类或类的方法?