[英]Knockout style binding does not update Left and Top
I got the following issue with the knockout style binding: I'm trying to build editor with nodes inside. 敲除样式绑定出现以下问题:我正在尝试构建内部带有节点的编辑器。 Also a minimap that should follow the nodes of the editor and display them and their movement on the editor.
还有一个微型地图,应该跟随编辑器的节点,并在编辑器上显示它们及其移动。 The positions of the nodes and their "clones" on the minimap should be synchronized.
微型地图上的节点及其“克隆”的位置应同步。
Html: 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: 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);
The Position property of each node holds an object { X, Y }. 每个节点的Position属性都包含一个对象{X,Y}。
The issues: 问题:
Edit: It seems that X and Y are not observable - this may answer the question?! 编辑:似乎X和Y不可观察-这可以回答问题吗?
2. (Resolved in the comments) When the minimap panner element is initially rendered its bound properties height and width are not actually bound. 2.(在注释中解决)最初渲染minimap panner元素时,其绑定属性height和width实际上并未绑定。 Again I can see their values in the Konockout context updated - "dimensions":Object height:977 width:1050 but there is no such styles applied to the element.
再次,我可以在Konockout上下文中看到它们的值更新-“ dimensions”:Object height:977 width:1050,但是没有将此类样式应用于元素。
似乎X和Y不可观察,只是常规性质?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.