如何将色带加载到数据表而不是颜色代码?

How to load a color strip to datatable instead of color code?

如何将颜色代码作为颜色条获取到数据表中?在所附图片中,它显示了颜色代码如何传递到数据表。我需要用相关的色带替换代码。是否可行,正确的方法是什么?

    $("#ServiceCreatorTable").DataTable
        ({
            "processing": true,
            "serverSide": true,
            "filter": true,
            "ajax": {
                "url": window.ApiUrl + "/ServiceCreator/GetServiceDetails",
                "type": "POST",
                "datatype": "json"
            },
            "columnDefs": [{
                "targets": [0],
                "orderable": true,

            }, 
            {
                "targets": [8],
                "searchable": false,
                "orderable": false
            }],

            "columns": [
                { "data": "service_Creator_Id", "name": "Service ID", "autoWidth": true },
                { "data": "service_Creator_Code", "name": "Service Code", "autoWidth": true },
                { "data": "service_Creator_Name", "name": "Service Name", "autoWidth": true },
                { "data": "service_Creator_Desc", "name": "Service Description", "autoWidth": true },
                { "data": "service_Category_Name", "name": "Service Category ID", "autoWidth": true },
                { "data": "service_Sub_Cat_Name", "name": "Sub Service Category ID", "autoWidth": true },
                { "data": "no_of_Sub_Services", "name": "No of Services", "autoWidth": true },
                { "data": "colour", "name": "Service Colour", "autoWidth": true },

                {
                    'data': null,
                    'render': function (data, type, row) {
                        return '<button class="btn btn-outline-danger btn-sm text-center" onclick="deleteservice(' + row.service_Creator_Id + ')"><i class="fas fa-trash-alt"></i></button>'
                    }
                },

            ]
        });
<table id="ServiceCreatorTable" class="table table-striped table-bordered table-responsive-sm" width="100%">
                                <thead>
                                    <tr>
                                        <th>SN</th>
                                        <th>Code</th>
                                        <th>Service Name</th>
                                        <th>Description</th>
                                        <th>Service Category</th>
                                        <th>Sub Service Category</th>
                                        <th>No Of Sub Services</th>
                                        <th>Colour</th>
                                        <th></th>
                                    </tr>
                                </thead>
                            </table>

尝试将 <div> 元素作为数据而不是原始颜色代码传递。

"<div style='height:20px;width:60px;background-color:#2bdc1e'></div>"