Angular ag-grid 編輯圖標點擊獲取行數據

Question

網格設置具有多個對象數組的 colDefs 最后是我在操作按鈕組件內顯示編輯圖標的操作

this.colDefs = [
    {
        headerName: 'ACTION',
        field: 'icon',
        cellRendererFramework: ActionButtonComponent,
        cellRendererParams: {
          prop1: this.rowData,
        },
        minWidth: 80,
        filter: false,
        maxWidth: 100,
        pinned: 'right',
      },
    ];
]

action.compoment.html (ActionButtonComponent)

<div><i aria-hidden="true" class="lmnicon lmnicon-edit" (click)="openDialog('update')"></i></div>

rowData 是我傳遞的對象數組，它們顯示在網格中

[{
        "clientId": 1,
        "clientName": "DS",
        "configId": 164,
        "configKey": "ofmurl",
        "configValue": "<url>",
        "environment": "SIT",
        "resourceName": "ofm",
        "resourceid": 88
},
{
        "clientId": 1,
        "clientName": "DS",
        "configId": 165,
        "configKey": "url",
        "configValue": "",
        "environment": "UAT",
        "resourceName": "reports",
        "resourceid": 86
    },
    {
        "clientId": 1,
        "clientName": "DS",
        "configId": 166,
        "configKey": "url",
        "configValue": "",
        "environment": "UAT",
        "resourceName": "entitlement",
        "resourceid": 87
    },
]
   

單擊該行的編輯圖標時如何獲取特定行數據對象

Answer 1

在 ActionButtonComponent 中，您可以使用：

params: ICellRendererParams;
data;

agInit(params: ICellRendererParams): void {
    this.data = params.value;
}

<div><i aria-hidden="true" class="lmnicon lmnicon-edit" (click)="openDialog(data)"></i></div>