I am currently utilizing Angular 1.4 with TypeScript and Kendo UI (employing angular directives).
My goal is to create a RowTemplate for each row that dynamically changes the color based on a specific property of the item.
While I am aware of jQuery solutions for this issue, I personally find them unsatisfactory. Since I am already using Angular, I prefer to stick with Angular-based approaches.
This is the HTML code snippet in question:
<div id="resultSubTasksGrid"
kendo-grid="resultGrid"
k-options="vm.gridOptions"
k-columns="vm.columns">
</div>
And here are my grid options:
gridOptions: kendo.ui.GridOptions = {
rowTemplate : "<tr data-uid='#: uid #' ng-class='sent: item.IsSent'></tr>"
}
The main issue I am facing lies in not wanting to override the entire row. The current approach does just that. Given that I have numerous columns, many of which contain cell templates I wish to preserve, integrating all of these into the RowTemplate isn't an ideal solution.
I am hoping to discover if it is feasible to implement something akin to the following:
rowTemplate : "<tr data-uid='#: uid #' ng-class='sent: item.IsSent'>{{RENDERCONTENT}}</tr>"