尝试在使用cellRenderer创建的按钮的click事件上调用服务方法时,我遇到此问题.
我正在使用带有Angular2的ag-grid.
{ headerName: 'Update',field: "update",width: 80,cellRenderer : this.updateRecord }
updateRecord(params) {
var eDiv = document.createElement('div');
eDiv.innerHTML = '<span class="my-css-class"><button class="edit">Edit</button></span>';
var eButton = eDiv.querySelectorAll('.edit')[0];
eButton.addEventListener('click',function() {
this.myService.getAll().subscribe(data => console.log(JSON.stringify(data)))
});
return eDiv;
}
我收到以下错误：
EXCEPTION: Cannot read property 'getAll' of undefined
此外,我无法访问任何我的组件变量.
cellRenderer位于不同的上下文中,因此在updateRecord函数中无法访问它.
您需要在gridOptions中初始化context参数并在params对象中使用它.
以这种方式在gridOptions对象中设置上下文
this.gridOptions.context = {
myService: this.myService
}
您的myService将在context属性中可用.
updateRecord(params) {
var eDiv = document.createElement('div');
eDiv.innerHTML = '<span class="my-css-class"><button class="edit">Edit</button></span>';
var eButton = eDiv.querySelectorAll('.edit')[0];
eButton.addEventListener('click',function() {
params.context.myService.getAll().subscribe(data => console.log(JSON.stringify(data)))
});
return eDiv;
}
