1

我想要做的是跟踪 (top, left, width, height, 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,但是当数据更改和元素更改时,我仍然需要更改上述值。

我觉得不应该需要我必须在末端添加的“px”,但这是我可以让它们应用的唯一方法。

从这一点开始有没有办法,可以说我正在使用 jqueryUI 可拖动和调整大小,并且用户移动/调整值将自动更新视图模型数据的元素?当然,最好使用非 jquery 特定的答案。

4

1 回答 1

0

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

于 2012-11-19T23:48:43.277 回答