从CellRendererFramework到父母发射事件

Question

使用Ag-Grid，您可以使用包括cellRendererFramework在内的列信息为GridOptions.columnDefs定义。我有一个用于cellRendererFramework的组件，其中包括一个事件，该事件是从单击其模板中的单击按钮触发的。我希望能够向父(columndef被定义的位置以及ag-grid-angular初始化的位置(发出此事件。

。

我可以看到我可以让事件通过ag-grid-angular的cellClicked事件进行...然后我可以查看该事件，以解析事件目标之类的信息，看看它是否在按钮上等。。

---

我的GridOption.columnDefs DEF看起来像这样：

{
  headerName: 'Actions',
  cellRendererFramework: ActionCellComponent,
  suppressFilter: true,
}

ActionCellComponent具有带有单击事件的按钮的模板，例如(click)="actions.deleteSchema($event)"，并在组件TS中拾取。

我希望从ActionCellComponent获得托管ag-grid和columnDefs的CC_11的事件，而无需分析cellClicked事件。

Answer 1

我在找到一种干净的方法来做到这一点时遇到了问题。您可以使用它来获取对已初始化cellRenderer的父组件的引用。

import {GridOptions} from "ag-grid";
constructor(){ 
    this.gridOptions = <GridOptions>{
        context: {
            componentParent: this
        }
    };
} 

确保在html中绘制网格

<ag-grid-angular #grid-reference [gridOptions]="gridOptions">

然后在您的cellRenderer中包括agInit，该CC_17将在绘制课程时被火。

public params;
public agInit(params: any): void {
    this.params = params;
    console.log(this.params.context.componentParent); 
    // access to parent functions / variables etc
}

因此，例如事件发生后，如果您的父级中有public hello: string，则可以在下面进行以下操作。

this.params.context.componentParent.hello = "hi"; // could be function call.

这应该允许您在两者之间进行互动，因此可以做。上下文是绑定的。

我希望这就是您要寻找的。

这是Ag-Grid的文档。