我有一个复选框行模板 - 我在渲染模板时设置了一个值，但 MVVM 检查绑定(bind)抛出异常。我很困惑为什么这不起作用，因为生成的代码几乎是剑道本身给出的示例( http://demos.telerik.com/kendo-ui/mvvm/elements )
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled</title>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.2.716/js/kendo.all.min.js"></script>
<script id="fTemplate" type="text/html">
<div>
<input type="checkbox" value="#=data#" data-bind="checked: selectedF"/>
<div style="display: inline-block; margin-left: 5px;">#=data#</div>
</div>
</script>
<script>
var viewModel = window.kendo.observable({
fSource: ["1","2","3"],
selectedF: [],
selectedFText: function(){
return viewModel.get('selectedF').join(',');
}
});
$(document).ready(function() {
window.kendo.bind($('body'), viewModel);
});
</script>
</head>
<body>
<ul data-bind="source: fSource" data-template="fTemplate"></ul>
<br/>
Selected: <div data-bind="text: selectedFText"></div>
</body>
</html>
最佳答案
问题是因为您尝试访问模板不知道的 viewModel 属性。
这是一个有效的示例。我很确定它会给你足够的帮助。
<script id="fTemplate" type="text/html">
<div>
<input type="checkbox" value="#=data.value#" data-bind="checked: isSelected"/>
<div style="display: inline-block; margin-left: 5px;">#=data.value#</div>
</div>
</script>
<script>
var viewModel = window.kendo.observable({
fSource: [
{
value:"1",
isSelected: false
},
{
value:"2",
isSelected: false
},
{
value:"3",
isSelected: false
}],
selectedF: [],
selectedFText: function(){
}
});
$(document).ready(function() {
window.kendo.bind($('body'), viewModel);
});
</script>
HTML:
<body>
<ul data-bind="source: fSource" data-template="fTemplate"></ul>
<br/>
Selected: <div data-bind="text: fSource[0].isSelected"></div>
</body>
你的 fiddle :
关于javascript - Kendo UI - 模板化复选框列表并将检查绑定(bind)到 viewModel，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25211184/