Json 在剑道网格中显示动态图像

我想在剑道网格中填充动态图像。 我正在获取json数据

我有以下代码

 var grid = $("#timeSegmentGrid").kendoGrid({
    //var icon='';  
        dataSource: {
            transport: {
                read: function (options) {
                    getTimeSegmentList("", onSuccess, null);
                    function onSuccess(responseData) {
                        if (responseData.segments != null)
                            options.success(responseData.segments);
                        else
                            options.success([]);
                    }
                }
            },
            pageSize: 5
        },
        pageable: {
            input: true,
            numeric: false,
            pageSizes: false,
            refresh: true
        },
        toolbar: kendo.template($("#template").html()),
        columns: [
            { field: "display_name", title: "&{'Name'}" },
            { field: "display_order", title: "&{'Display Order'}" },
            { field: "icon",
                title: "Icon"
            }
        ]
    }).data("kendoGrid");

“图标”包含图像的路径。现在，我可以打印路径，但我真的不知道如何根据该路径显示图像。非常感谢您的帮助。

您能试试：

columns : [
    { 
        field: "icon",
        title: "Icon",
        template: '<img src="#= icon #" alt="image" />'
    }
]

列：[
{ 
字段：“图标”，
标题：“图标”，
模板：“”
}
]

试试看，这可能会很有帮助

@(Html.Kendo().Grid<TelerikMvcAppCombo.Models.ImageModel>()
.Name("grdImageModel")
.Columns(columns =>
{
    columns.Bound(c => c.IMAGESIZE_ID).ClientTemplate("<input type='checkbox'     value =#IMAGESIZE_ID#  />");
    columns.Bound(c => c.IMAGESIZE_NAME).Width(140);
    columns.Bound(c => c.IMAGESIZE_DESC).ClientTemplate("<img src='" + 
    Url.Content("~/Images/") + "#=IMAGESIZE_NAME#'/>");
    columns.Bound(c => c.created_by);
    columns.Bound(c => c.created_date);
    columns.Bound(c => c.modified_by);
    columns.Bound(c => c.modified_date);
})
.HtmlAttributes(new { style = "height: 580px;" })
.Scrollable()
.Groupable()
.Sortable()
.Pageable(pageable => pageable
    .Refresh(true)
    .PageSizes(true)
    .ButtonCount(10)
)
.DataSource(datasource => datasource
    .Ajax()
    .Read(read => read
            .Action("GetData", "Image")
          ))

)

@（Html.Kendo（）.Grid（））
.名称（“grdImageModel”）
.列（列=>
{
columns.Bound（c=>c.IMAGESIZE_ID）.ClientTemplate（“”）；
columns.Bound（c=>c.IMAGESIZE_NAME）.Width（140）；
columns.Bound（c=>c.IMAGESIZE_DESC）.ClientTemplate（“”）；
columns.Bound（c=>c.created_by）；
columns.Bound（c=>c.created\u date）；
columns.Bound（c=>c.modified_by）；
columns.Bound（c=>c.modified_date）；
})
.HtmlAttributes（新的{style=“height:580px；”}）
.Scrollable（）
.Groupable（）
.Sortable（）
.Pageable（Pageable=>Pageable
.刷新（真）
.页面大小（真）
.按钮计数（10）
)
.DataSource（DataSource=>DataSource
.Ajax（）
.Read（Read=>Read
.Action（“获取数据”、“图像”）
))
)