[英]How to detect change in ag-grid when my row data is updated while passing from one component to other
I am working on a Project which is on angular6 & we are implementing ag-grid to populate the data from angular dialog box.我正在开发一个关于 angular6 的项目,我们正在实施 ag-grid 来填充来自 angular 对话框的数据。 Since Multiple teams are working so they are creating there own component .I am stuck at One of the unusual situation and I am not able to figure out how to resolve the situation .
由于多个团队正在工作,因此他们正在创建自己的组件。我陷入了一种不寻常的情况,我无法弄清楚如何解决这种情况。 We have a button called (ADD OWNER) which is a component called ADD-OWNER.component.ts where I am opening a dialog box and passing another component called ownerdetails.component.ts which have my all form details.
我们有一个名为 (ADD OWNER) 的按钮,它是一个名为 ADD-OWNER.component.ts 的组件,我在其中打开一个对话框并传递另一个名为 ownerdetails.component.ts 的组件,其中包含我的所有表单详细信息。 There are 2 buttons (ADD/CANCEL) over dialog box so that I am pushing data into a metadata service as I don't have to save in database ,I have to keep the data over browser.
对话框中有 2 个按钮(添加/取消),因此我将数据推送到元数据服务中,因为我不必保存在数据库中,我必须通过浏览器保存数据。 That Part of coding I did in dialog.closed event which is working fine .Now I have to pass this ownerdetails into another component called Gridcomponent where my ag-grid is so I have used input property event to send data from my add-owner.component to grid component.
我在 dialog.closed 事件中所做的那部分编码工作正常。现在我必须将此 ownerdetails 传递到另一个名为 Gridcomponent 的组件中,我的 ag-grid 在其中,所以我使用输入属性事件从我的 add-owner 发送数据。组件到网格组件。 I am rendering grid component selector into my add-onwer.component.ts by passing input details like given.
我通过传递给定的输入细节将网格组件选择器渲染到我的 add-onwer.component.ts 中。 Now I am using input property in my grid to receive the value but I want grid to be updated automatically when there is a change in rowdata.
现在我在我的网格中使用 input 属性来接收值,但我希望在 rowdata 发生变化时自动更新网格。 The value is not updated ,how do I achieve that.
该值未更新,我该如何实现。 I could see values are getting pushed into ownerlist but somehow I have to show in grid.
我可以看到值被推入所有者列表,但不知何故我必须在网格中显示。 I don't have the exact code but I tried my best TO explain .
我没有确切的代码,但我尽力解释。
<button mat-button (click)="openDialog()">Open dialog</button>
<app-grid-selector [gridOptions]="ownerlist ">
openDialog() {
const dialogRef = this.dialog.open(OwnerDetails);
dialogRef.afterClosed().subscribe(result => {
ownerlist = Pushing data into a metadata service which is working fine
});}
<ag-grid-angular
style="width: 500px; height: 500px;"
class="ag-theme-balham"
[rowData]="owner"
[columnDefs]="columnDefs"
>
</ag-grid-angular>
grid.component.ts
@Input() gridoptions
ngOnint(){
owner =this.gridOptions.rowData
}
As of ag-grid
version `^22.1.1 you can use从
ag-grid
版本`^22.1.1 开始,您可以使用
In component:在组件中:
onRowDataUpdated
as onRowDataUpdated
为
gridOptions = {
onRowDataUpdated: function(){//do something}
}
Use gridOptions
in template as在模板中使用
gridOptions
作为
<ag-grid-angular
...
[gridOptions]="gridOptions"
...
>
</ag-grid-angular>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.