Question

我在敲除样式绑定时遇到了以下问题：我正在尝试使用内部节点构建编辑器。也是一个迷你地图，应该遵循编辑器的节点并在编辑器上显示它们和它们的移动。节点的位置及其在小地图上的“克隆”应该是同步的。

HTML：

<div id="minimap">
            <div id="minimap_panner" data-bind="style: { height: dimensions.height + 'px', width: dimensions.width + 'px' }">
                <!-- ko foreach: { data: nodePositions() } -->
                <div class="minimap-node-item" data-bind="style: { left: X + 'px', top: Y + 'px' }"></div>
                <!-- /ko -->
            </div>
        </div>

JS：

ko.applyBindings({
            nodePositions: ko.computed(function () {
                var nodes = model.displayedNodes()();

                return nodes.map(function (node) {
                    return ko.observable(node.Position);
                });
            }),
            dimensions: ko.computed(function () {                     
                return { width: editorElement.scrollWidth, height: editorElement.scrollHeight };
            })
        }, minimapPanner);

每个节点的位置属性包含一个对象{X，Y}。

问题：

当最初在小地图上渲染“克隆”时，它们的位置是正确的。但是当我在编辑器上移动一个节点时，它在迷你地图上的“克隆”并没有改变它的位置，即使我看到Knockout上下文（浏览器扩展）的变化。我的意思是：“克隆”的上下文已更改，但其绑定的样式属性（左侧和顶部）保持原样。

编辑：似乎X和Y不可观察 - 这可能会回答这个问题？！

2。（已在评论中解决）当 minimap panner 元素最初呈现时，其绑定属性高度和宽度实际上并未绑定。我再次看到他们在Konockout上下文中的值已更新 - “尺寸”：对象身高：977 宽度：1050 但是没有这样的样式应用于元素。

Answer 1

似乎X和Y不是可观察的，只是常规属性？！

Knockout样式绑定不会更新Left和Top

1 个答案: