javascript – 带按钮单击的Ag-Grid cellRender

我正在使用带有ag-grid数据表的角度5
我无法在这里使用cellRenderer从单元格触发click事件如何使用我的ag-grid – > colDefs

this.columnDefs = [
            {headerName: '#', rowDrag: true, width: 75},
            {headerName: 'One', field: 'fieldName',
                cellRenderer : function(params){
                    return '<div><button (click)="drop()">Click</button></div>'
                }
            }
];

drop() {
    alert("BUTTON CLICKEFD")
}

如果使用onClick =“alert(”123“)” – >有用,
但是我无法使用onClick =“drop()”它会丢弃未定义的内容,

我也在cellRenderer中尝试过这个 – > params = params.$scope.drop = this.drop;

如果使用带有angularCompileRows的gridOptions：true则抛出错误无法读取未定义的属性’$apply’.
我是否需要安装ag-grid企业？

解决方法:

您可以将cellRenderer与按钮组件一起使用.
如果要从表上的用户获取按钮上的单击事件,只需声明要对cellRendererParams执行的回调函数.

// app.component.ts
columnDefs = [
{
  headerName: 'Button Col 1',
  cellRenderer: 'buttonRenderer',
  cellRendererParams: {
    onClick: this.onBtnClick.bind(this),
    label: 'Click'
  }
},
...
]

上面的代码只是一小部分,请查看Stackblitz的完整示例

标签：ag-grid,javascript,typescript,angular5,ag-grid-ng2
来源： https://codeday.me/bug/20190910/1799501.html