Kendo UI网格和ng样式 [英] Kendo UI Grid and ng-style

问题描述

我有一个Kendo UI网格，它从我的数据源中读取了一系列属性. 其中之一包含一个颜色字符串.我想使用上述颜色字符串为网格中的方形框设置背景色.

I have a Kendo UI Grid in angular which is reading from my datasource a series of properties. One of them contains a color string. I want to use said color string to set the background-color for a square-box in the grid.

我正在使用以下模板作为框:

I'm using the following template for the box:

template: "<img class='alarm-box-prediction variable' ng-style={'background-color': dataItem.type}'></img>"

我的dataSource中的相关数据如下:

The relevant data from my dataSource is the following:

dataSource: {
        dataSource: function(data) {
            // Map the stored properties in the data array of objects received to 
            // their corresponding columns in the Grid
            return $.map(data, function(alarmProperty) {
                return {
                    // Change array index to match API once we are getting data from there
                    type: alarmProperty[0],
                    //... there are more properties here but i removed them as they are not the focus
                };
            });
        },

当前用作我的DS的JSON文件中的相关数据是(

The data relevant from the JSON file which is currently serving as my DS (will be changed soon though) is:

{
    "alarms": [
        {
            "type": "Yellow",
//...
        }
//...
]}

推荐答案

找出了问题所在. ng-style需要采用不同的格式，因为它是作为字符串传递给剑道的.

Found out the issue. ng-style needs to be formatted differently because it is being passed as a string to kendo.

template: "<img class='alarm-box-prediction variable' ng-style=\"{'background-color':dataItem.type}\"></img>",

这篇关于Kendo UI网格和ng样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！