All DOM changes of the table go through this service – the third argument of new TableScope(…). Plain TypeScript and most wrappers use SimpleDomService; Angular uses its Renderer2. Cell renderers get it as last argument of CellRendererIf.render.
new TableScope(…)
Renderer2
// inside CellRendererIf.render(cellDiv, …, cellValue, dom)const badge = dom.createElement<HTMLSpanElement>("span");dom.addClass(badge, "status-badge");dom.setStyle(badge, "margin-left", "4px");badge.textContent = String(cellValue);dom.appendChild(cellDiv, badge); Copy
// inside CellRendererIf.render(cellDiv, …, cellValue, dom)const badge = dom.createElement<HTMLSpanElement>("span");dom.addClass(badge, "status-badge");dom.setStyle(badge, "margin-left", "4px");badge.textContent = String(cellValue);dom.appendChild(cellDiv, badge);
Adds a CSS class.
Appends a child element.
Appends text to an element (no HTML parsing).
Creates an element: createElement<HTMLSpanElement>("span").
createElement<HTMLSpanElement>("span")
Creates a text node.
Removes a CSS class.
Sets an attribute.
Sets one CSS property: setStyle(el, "background-color", "#fdf2f8").
setStyle(el, "background-color", "#fdf2f8")
All DOM changes of the table go through this service – the third argument of
new TableScope(…). Plain TypeScript and most wrappers use SimpleDomService; Angular uses itsRenderer2. Cell renderers get it as last argument of CellRendererIf.render.Example