javascript - 当变量值有空格时如何在kendo UI的itemTemplate中渲染JS变量

Question

我在 itemTemplate 函数中使用来自服务器的响应数据来创建带有值的复选框列表。我面临的问题是，如果有一个变量的值中有空格，例如:“In Progress”，那么它无法正确渲染。

下面是我的 itemTemplate 函数和数据渲染后的 html 元素。

 itemTemplate: function (e) {
       return "<li class='k-item><label class='k-label'><input type='checkbox' value=#= data.Status || data.all # />#= data.Status|| data.all #</label></li>"
  }

Here is a demo of the same 。有没有办法呈现数据，以便我可以获取 value 属性内的整个文本？或者我在这里做错了什么？请推荐，谢谢!

Answer 1

您需要添加转义引号，如下所示:

\'#=data.country|| data.all #\'

$("#grid").kendoGrid({
    columns: [ {
        field: "country",
        filterable: {
            multi:true,
            itemTemplate: function(e) {

                    return "<li class='k-item><label class='k-label'><input type='checkbox' value=\'#=data.country|| data.all #\' />#= data.country|| data.all #</label></li>"


            }
        }
    }],