首页 文章

Angular2 - Ag Grid - 在单元格渲染器组件中获取父实例

提问于
浏览 次
1

我正在使用Ag Grid在我的项目中显示项目列表 . 我已经使用colDef为网格实现了Ag Grid，如下所示

custom.component.ts

CustomComponent

// colum定义数组

[
             {
                headerName: "Actions", 
                field: "action", 
                width: 100,
                cellRendererFramework: ActionRendererComponent,
            },
]

ActionRendererComponent

import {Component} from '@angular/core';
import {AgRendererComponent} from 'ag-grid-ng2/main';

@Component({
    selector: 'action-cell',
    template: `
    <a href="javascript:" *ngIf="showEditLink" (click)="edit()">&nbsp;&nbsp;Edit</a>
    <a href="javascript:" *ngIf="showSaveLink" (click)="save()">&nbsp;&nbsp;Save</a>
    <a href="javascript:" *ngIf="showCancelLink" (click)="cancel()">Cancel</a>
    `
})

export class ActionRendererComponent implements AgRendererComponent {
 public edit(){
  ..some logic here
 }
 public save(){
  ..some logic here
 }
 public cancel(){
  ..some logic here
 }
}

现在问题是我无法访问 ActionRenderer 中的任何函数中的父实例CustomComponent，如save（），edit（），cancel（） . 如何将父实例传递给 ActionRenderer 组件？

angular ag-grid

2 回答

  • 0

    尝试在ActionRendererComponent中使用 this.params.context.componentParent . 请参阅给出here的child-message.component的源代码

    问候 .

    回复于
  • 3

    在初始化网格时，在父组件中，请确保在其构造函数中添加以下代码：

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

    在您的模板中，请确保包含gridOptions

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

    请务必按照上述步骤操作 . 在单元格渲染器组件中，尝试记录参数 . 你应该能够得到this.params.context.componentParent .

    供进一步参考：Ag-grid parent-child

    回复于

相关问题