Как вызвать функцию из Cell Renderer - ag grid
я использую cellrenderer в vue.js, я хочу вызвать функцию из средства визуализации ячеек.
прикрепил сюда мой код:
gridColumns() {
return [{
headerName: "Actions",
cellRenderer: 'iconRender',
width: 140,
cellRendererParams: (params) => {
return {
icon: ['edit', 'delete_forever'],
color: 'gray'
}
}
},
{
headerName: "Name",
field: "name"
},
{
headerName: "Artiyfactory Name",
field: "artifactoryName"
},
{
headerName: "Artifact Type",
field: "artifactType"
},
{
headerName: "Deployment Action",
field: "deploymentAction"
},
{
headerName: "Location",
field: "usage.location"
},
{
headerName: "Destenition On Setup",
field: "usage.destOnSetup"
},
]
}
},
function iconRender(params) {
var spanElement = document.createElement("span");
var textElement = document.createElement("span");
if (params.value != undefined) {
textElement.innerHTML = " " + params.value;
textElement.style.verticalAlign = "middle";
}
params.icon.forEach(element => {
var iconElement = document.createElement("i");
iconElement.className = "material-icons";
iconElement.style.color = params.color;
iconElement.style.verticalAlign = "middle";
iconElement.innerHTML = element;
spanElement.appendChild(iconElement);
});
spanElement.appendChild(textElement);
return spanElement;
}Я хочу вызвать функцию из элемента значка, я пробовал несколько способов, но у меня ничего не работает.
не могли бы вы взглянуть и сказать мне, как я могу это сделать?
Спасибо :)
Спасибо!, не могли бы вы сказать мне, что я должен написать в iconRender, чтобы вызвать myfunc()?
когда вы передаете определение столбца экземпляру ag-grid, ваша функция будет привязана к атрибуту cellrenderer для этого столбца. Поэтому, когда в жизненном цикле сборки он проверяет значение в cellRenderer, он увидит вашу функцию и затем запустит ее.
но я не понимаю, как я вызываю функцию, я хочу вызвать функцию сом при нажатии на значок
ах - тогда вам нужно прикрепить обработчик кликов. GridOptions имеет атрибут onCellClicked, и там вы назначите функцию.
я не хочу щелкать по ячейке, я хочу щелкать по иконке... возможно ли это?
тогда вы можете назначить обработчик кликов через дом, но это может повлиять на производительность
что значит "дом"?
Объектная модель документа developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/…
это может работать params.icon.forEach(element => { var iconElement = document.createElement("i"); iconElement.className = "material-icons"...... iconElement.addEventListener('click', () => ВАША ФУНКЦИЯ) spanElement.appendChild(iconElement);});
все еще не работает :(
ag-grid.com/javascript-grid-events
Ответы 1
Вместо создания элемента через dom. вы можете создать пользовательский компонент для ячейки. в ag-grid, когда вы нажимаете на ячейку, это только событие захвата ячеек, а не то, что находится внутри ячейки (в вашем случае значок). Вы можете создать пользовательский компонент для визуализации ячейки, и вы можете делать все, как обычный компонент. Пожалуйста, обратитесь к [https://plnkr.co/edit/3nZPzwmGufKGXwvn], я комментирую плункер, пожалуйста, обратитесь к последнему столбцу, где у них есть кнопка.
вам может повезти привязать функцию к атрибуту при объявлении ColDef следующим образом:
{cellRenderer: this.iconRender.bind(this)}