我正在使用RPNiemeyer的kendo-knockout库。我有一个剑道窗口:
HTML:
<div data-bind="kendoWindow: {isOpen: isOpen, title:'Language', width: 400, height: 200, modal: true, widget: popUpWindow }" >
以窗口为中心的JavaScript部分:
this.popUpWindow = ko.observable();
self.isOpen.subscribe(function (newValue) {
if (newValue) {
self.popUpWindow().center();
}
});
我使用上一个问题的源代码作为我的小提琴:
Kendo-Knockout: Window does not close correctly
我按照此处显示的步骤进行操作:
Kendo-Knockout: How to center window
我正在定义窗口小部件observable但是当我想要使用它时,它没有填充实际的窗口小部件。
小提琴: http://jsfiddle.net/dcYRM/15/
非常感谢任何有关工作示例的帮助。
答案 0 :(得分:3)
看起来有几个问题:
首先,您的isOpen
订阅在小部件填充之前正在运行。
其次,填充窗口小部件后,它会导致数据源刷新,并尝试序列化包含窗口小部件的模型,这会导致问题。这最终是因为Knockout-Kendo在解包传递给网格的数据方面有点过于激进。
我看到两种很简单的方法来解决这个问题。最简单的方法是为小部件的open
事件和呼叫中心设置全局处理程序。
将此问题与前一个问题中的close
事件放在一起,如下所示:
ko.bindingHandlers.kendoWindow.options = {
close: function() {
$('.k-window, .k-overlay').remove();
},
open: function(event) {
event.sender.center();
}
};
现在,无论何时打开任何窗口,它都会居中,您根本不需要弄乱窗口小部件。此处示例:http://jsfiddle.net/rniemeyer/F4JGG/
这看起来是最好的选择。要使其与窗口小部件本身的引用一起使用,您需要解决库中的问题。如上所述,它有点过于激进并且展开选项,并且当初始化窗口小部件,传递窗口小部件参数以及它已经填充了窗口小部件时,这似乎会导致问题。当我有机会时,我应该能够在图书馆中解决这个问题。
否则,你必须这样做:
self.popUpWindow = ko.observable();
self.popUpWindow.subscribe(function (widget) {
if (widget) {
widget.center();
self.popUpWindow(null); //hack - Knockout-Kendo should handle this one
}
});
因此,在您调用center
之后清除observable。以下是一个示例:http://jsfiddle.net/rniemeyer/PVMjy/。我还订阅了widget的observable本身,因此上面提到的isOpen
没有时序问题。
在这种情况下,设置全局open
处理程序似乎是最干净,最好的选择。