Question

我想要做的是跟踪（顶部，左侧，宽度，高度，zIndex）样式属性。但是，由于持有这些样式的元素在第三方代码被引入之后才存在，我无法以正常方式进行。

这是我迄今为止所得到的：

    my.Module = function (module) {
    return {
            top: ko.observable(200);,
            left: ko.observable(100);,
            width: ko.observable(100);,
            height: ko.observable(100);,
            zIndex: ko.observable(0);,
        };
    };

这将是正常的绑定上下文：

<div data-bind="style:{width:width, top:top, left:left, height:height, zindex:zIndex}"></div>

但是第三方的东西最终将div包裹在另一个内部，这是我无法改变的。所以我开始创建一个自定义绑定处理程序：

 ko.bindingHandlers.Window = {
        init: function (element, valueAccessor) {
            var value = ko.utils.unwrapObservable(valueAccessor());

            //Do third party creation stuff here...

            ko.applyBindingsToNode(elemToActuallyWatch, {
                style: {
                    width: value.width() + 'px',
                    height: value.height() + 'px',
                    top: value.top() + 'px',
                    left: value.left() + 'px',
                    zIndex: value.zIndex()
                }
            });
        },

现在这将上述样式应用于适当的div，但是当数据更改和元素更改时，我仍然需要更改上述值。

我觉得像是＆＃39; px＆＃39;我不得不提出必须解决的问题，但这是我能让他们申请的唯一方法。

从现在开始有没有办法让我说使用jqueryUI可拖动和可调整大小，用户移动/调整值会自动更新viewmodel数据的元素？当然，非jquery特定答案最好。

Answer 1

style是一种单向绑定，从模型到视图。它不会从视图中更新模型。您可能需要使用resize option并从那里更新模型。

如何使用Knockout观看样式

1 个答案: