当属性名称在字符串中时，Kendo UI (jquery)模板获取值
当属性名称在字符串中时，Kendo UI (jquery)模板获取值
提问于 2019-12-11 02:15:50
我正在构建一个KendoGrid，它具有可变数量的列，这些列直到运行时才知道。我已经准备好了获取第一行数据并生成模式和列信息的代码，这些信息在网格连接之前附加到Kendo DataSource。我还使用代理将列字段和显示名称注入到模板中。
我遇到的困难是不知道如何直接引用行数据，而不知道属性名称。我知道在一个普通的kendo模板中，您可以使用#= WorkItemId =来获取值本身，但是我正在寻找类似于#= model[item.field] #的东西，这样我就可以动态地拉取值。
这是可能的吗？我尝试过this，但这又指向了我用$.proxy注入的值。我也尝试过item，model等，但似乎都没有给我想要的东西。
// kendo.datasource
for (i = 0; i < columns.length; ++i) {
// add template to the cell
columns[i].template = $.proxy(
kendo.template($('#QueueTemplate_Default').html()),
{
columnName: columns[i].title,
fieldName: columns[i].field
}
);
}
// cell template
<script id="QueueTemplate_Default" type="text/x-kendo-template">
#= {{model/this/something}}[item.columnName] #
</script>
// example schema that comes back from the controller
{
"schema": {
"data": "Data",
"total": "Total",
"model": {
"id": "WorkItemId",
"field": {
"WorkItemId": {
"editable": false,
"type": "number"
},
"WorkItem": {
"editable": false,
"type": "string"
},
// edited for brevity
}
}
},
"columns": [
{
"field": "WorkItemId",
"title": "Work Item Id",
"template": null
},
{
"field": "WorkItem",
"title": "Work Item",
"template": null
},
// edited for brevity
]
}回答 1
Stack Overflow用户
回答已采纳
发布于 2019-12-11 03:19:53
在模板内部，您有data对象。实际上，您只能通过#= PropertyA #之类的名称访问所有属性，因为代码被包装到一个with(data) { ... }(reference)语句中。所以做#= PropertyA #和做#= data.PropertyA #是一样的。请注意，with已过时。
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled</title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.default.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.mobile.all.min.css">
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.3.1023/js/angular.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.3.1023/js/jszip.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.3.1023/js/kendo.all.min.js"></script>
<script>
let data = {
propertyName: 'myProperty',
myProperty: 'myValue'
};
console.log(kendo.template("#= data[data.propertyName] #")(data));
</script>
</head>
<body>
</body>
</html>
我认为你的情况可以是这样的：
<script id="QueueTemplate_Default" type="text/x-kendo-template">
#= data[item.columnName] #
</script>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/59273185
复制相关文章
相似问题
腾讯云开发者
