我只应用了一次绑定,但仍然出现错误
您不能多次将绑定应用于同一元素。
这是我的剧本。
<script>
var self = this;
var vm = function viewModel() {
self.getAppointment = function () {
$("#dialog-confirm ").dialog({
resizable: false,
height: 250,
width: 500,
modal: true
});
self.checkAppointmentListSelect(true);
}
self.checkAppointmentListSelect = ko.observable(false);
self.btnSelectAppointmentClick = function () {
self.checkAppointmentListSelect(true);
}
debugger;
}
ko.applyBindings(vm);
</script>
这是html数据
<div id="dialog-confirm" title="Select Appointment">
<div class="modal-body" data-bind="visible: checkAppointmentListSelect">
<button class="btn btn-primary" id="btnSelectAppointment" data-bind="click: btnSelectAppointmentClick">Select</button>
<button class="btn btn-primary" id="btnCancel">Cancel</button>
</div>
<div class="modal-body" data-bind="visible: checkAppointmentListSelect">
<button class="btn btn-primary" id="btnSelectAppointment">Select </button>
<button class="btn btn-primary" id="btnCancel">Cancel</button>
</div>
</div>
答案 0 :(得分:1)
有几点需要注意:
var self = this;
应该在构造函数中。在外面,this
指的是窗口对象。
您应该将包含observable
属性的对象传递给ko.applyBindings()
。不是功能本身。
您可以使用Function Expression or Function Declaration在javascript中创建一个函数。您的代码中不需要viewModel
。它也是
var vm = function() {}
或function vm(){}
。
默认情况下,您已将checkAppointmentListSelect
设置为false
。您的按钮不会在加载时显示,您可以单击。
将您的代码更改为:
function vm() {
var self = this; // this should be inside the vm function
self.getAppointment = function() {
$("#dialog-confirm ").dialog({
resizable: false,
height: 250,
width: 500,
modal: true
});
self.checkAppointmentListSelect(true);
}
self.checkAppointmentListSelect = ko.observable(true);
self.btnSelectAppointmentClick = function() {
self.checkAppointmentListSelect(true);
}
}
ko.applyBindings(new vm()); // `new vm()` creates an object of type vm
Here's a fiddle。如果您仍然遇到任何问题,请进行所有这些更改并告诉我。