javascript – Kendo UI网格单元格背景颜色

在kendo ui网格中,我该如何更改背景颜色？我试图为列设置模板,但是当网格可视化时,它是空的,没有任何颜色.
我有这个代码：

$scope.thingsOptions = {
    sortable: "true",
    scrollable: "true",
    columns: [
              { field: "Colore", title: "Colore", width: "160px", template: "<div><span style='background-color:red'></span></div>" }
             ]

};

如何应用模板为单元格的背景着色

解决方法:

你的代码基本上没问题.您可以按照自己的方式进行,但是您没有看到它,因为span和div是空的,因此元素的宽度为0px,您无法看到它.

尝试做：

$scope.thingsOptions = {
    sortable: "true",
    scrollable: "true",
    columns: [
        { 
            field: "Colore", 
            title: "Colore", 
            width: "160px", 
            template: "<div><span style='background-color:red'>This is a test</span></div>" 
        }
    ]
};

要么

$scope.thingsOptions = {
    sortable: "true",
    scrollable: "true",
    columns: [
        { 
            field: "Colore", 
            title: "Colore", 
            width: "160px", 
            template: "<div style='background-color:red'>&nbsp;</div>"
        }
    ]
};

甚至：

$scope.thingsOptions = {
    sortable: "true",
    scrollable: "true",
    columns: [
        { 
            field: "Colore", 
            title: "Colore", 
            width: "160px", 
            template: "<span style='float: left; width: 100%; background-color:red'>&nbsp;</div>"
        }
    ]
};

请务必注意,span和/或div的内容不为空：它们包含& nbsp;.

但如果你想要它有颜色而没有填充/边距,那么你可以使用：

{ 
    field: "Colore", 
    title: "Colore", 
    width: "160px", 
    attributes: {
        style: "background-color: red"
    }
}

标签：javascript,angularjs,kendo-ui,kendo-grid
来源： https://codeday.me/bug/20190728/1562409.html