Hi Test,
Thanks for contacting Syncfusion support.
We have analyzed your query and we have prepared a sample based on your requirement that can be available from the below link.
From the above code example we have used ng-style for the columnTemplate and changed the background color as red. Also we can use queryCellInfo event in grid to change the background color for the column based on the corresponding value. So that we can customize each cell based on our needs.
Please refer the below code example.
<body ng-controller="PhoneListCtrl">
<div id="grid" ej-grid e-datasource="data"
e-columns="col" e-allowpaging="true" e-querycellinfo="querycellinfo"></div>
<script type="text/javascript">
angular.module('listCtrl', ['ejangular'])
.controller('PhoneListCtrl', function ($scope) {
...
$scope.querycellinfo = function (args) {
if (args.text == "10007") {
$(args.cell).css("background-color", "#336c12")
}
}
//Columns for Parent Grid
$scope.col = [
...
{ "headerText": "Ng click", "template":"#actionTemplate", "textAlign": "right", "width": 90 }]
});
</script>
<script type="text/ng-template" id="actionTemplate">
<div id='exportIntegratorTemplate' ng-style="{'background-color':data.Color, 'cursor': 'pointer'}">{{data.Color}}</div>
</script>
</body>
</html> |
Please refer the documentation link.
If you still face the issue please get back to us with the following details.
1. Share the full grid code that you have rendered.
2. Share the screenshot or video of the issue that you have faced.
The provided information will help us to analyze the issue and provide you the response as early as possible.
Please let us know if you need further assistance.
Regards,
Manisankar Durai