如何在Ag网格Javascript网格中添加按钮列

Question

我已经设法让社区版本的AgGrid(Javascript(运行

然而，我连一个按钮都无法工作？

function drop( id) {
alert(id);
}
var columnDefs = [
{ headerName: "HELLO", field: "name", sortable: true, filter: true },
{ headerName: 'One', field: 'fieldName',
cellRenderer : function(params){
return '<div><button (click)="this.drop(params.id)">Click</button></div>'
}
}
];

当用户点击按钮时，我需要调用函数

什么都没发生？控制台中甚至没有错误？

我做错了什么？

社区版是否禁用了此功能？

请注意，我需要一个Javascript解决方案，而不是Angular或Ag Grid 支持的任何其他语言/框架

Paul

Answer 1

使用cellRenderer时，不应像(click)="this.drop(params.id)"那样注册事件。

相反，使用javascript方式注册监听器。看看下面的代码。

colDef.cellRenderer = function(params) {
var eDiv = document.createElement('div');
eDiv.innerHTML = '<span class="my-css-class"><button class="btn-simple">Push Me</button></span>';
var eButton = eDiv.querySelectorAll('.btn-simple')[0];
eButton.addEventListener('click', function() {
console.log('button was clicked!!');
});
return eDiv;
}

参考：ag网格单元渲染器