我想根据模型中的字段是否发生变化来显示或隐藏我的剑道模板的元素。
首次尝试:
<input type="text" data-bind="value: schedulerEventFieldOne"/>
<input type="text" data-bind="value: schedulerEventFieldTwo, visible: schedulerEventFieldOne != schedulerEventFieldOneOrigValue"/>
尝试两个是将'schedulerEventFieldOneOrigValue'字段添加到我的模型中,然后执行此操作:
{{1}}
但是这给了我一个错误,指出没有定义schedulerEventFieldOne。它似乎不喜欢平等测试。这是奇怪的,使用&lt; o r&gt;测试似乎工作正常:“visible:schedulerEventFieldOne&gt; 0”
有没有办法使用kendo绑定完成我的任务?或者我将不得不再次诉诸jQuery?
答案 0 :(得分:0)
你没有说明任何问题,那么为什么不用第二种方法在视图模型上做呢?我相信可以做到这一点:
$(document).ready(function() {
var vm = kendo.observable({
form: {
country: ""
},
original: {
country: ""
},
isDisabled: function() {
return this.get("form.country") != this.get("original.country");
},
save: function() {
}
})
kendo.bind($("#test"), vm);
});
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled</title>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.mobile.all.min.css">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.930/js/angular.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.930/js/jszip.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.930/js/kendo.all.min.js"></script>
</head>
<body>
<div id="test">
<input type="text" data-bind="value: form.country" />
<button data-bind="click:save, visible:isDisabled">Save</button>
</div>
</body>
</html>