javascript - 剑道击倒 : widget observable is not filled with the actual widget

标签 javascript knockout.js kendo-ui

我正在使用 RPNiemeyer 的剑道 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();
        }
    });

我正在使用我之前问题中的源代码作为我的 fiddle :

Kendo-Knockout: Window does not close correctly

我正在按照此处显示的步骤操作:

Kendo-Knockout: How to center window

我正在定义可观察的小部件,但是当我想使用它时,它并没有填充实际的小部件。

fiddle : http://jsfiddle.net/dcYRM/15/

任何有关工作示例的帮助将不胜感激。

最佳答案

看起来有几个问题:

首先,您的 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 后清除可观察对象。这是一个示例:http://jsfiddle.net/rniemeyer/PVMjy/ 。我还订阅了小部件的可观察本身,因此不存在上面提到的 isOpen 的计时问题。

在这种情况下,设置全局 open 处理程序似乎是最干净、最好的选择。

关于javascript - 剑道击倒 : widget observable is not filled with the actual widget,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14213330/

相关文章:

javascript - 如何在 Chrome 扩展中调试 background.js 中的事件监听器

javascript - Chrome V8 实际实现了哪个版本的 ECMAScript 标准?

javascript - 为这个 Jquery 代码寻找更好/优雅的解决方案

javascript - 使用 Knockout.js 在 radio 输入中确认提示调用的单击事件

javascript - 使用 Knockout : Visible changes not saved 控制网页

javascript - 消除键盘输入的抖动?

javascript - 可视化库建议

javascript - areSame 或 mustMatch 示例的 Knockoutjs 验证

kendo-ui - 在 Kendo 中获取 Angular TreeView 的节点元数据

javascript - 网格初始化后的 Kendo 网格事件处理