我已经在模板 View 中嵌入了一个大的svg。所有svg元素的ID均与 Sproutcore 数据存储区中的guid记录相对应。
现在,我在每条记录上都有一个“选定的” bool 属性。
每当“selected”属性在True和False之间切换时,我都希望调整记录的相应svg元素。该 View 应反射(reflect)对记录的选定属性的更改。
我不知道如何设置绑定(bind)/观察做到这一点。如果我自己为每条记录构建带有sc的svg,我就会知道如何设置绑定(bind)。但是当您已经有svg时,我不知道如何建立绑定(bind)。
型号代码:
App.Node = SC.Record.extend(
name : SC.Record.attr(String),
value : SC.Record.attr(String),
selected: SC.Record.attr(Boolean),
}),
查看代码:
App.svg_picture = SC.View.design({
childViews: 'svgpicture'.w(),
layout: { left:12, right:12, top:12, bottom:12},
svgpicture: SC.TemplateView.create({
/**
* settings.
*/
templateName: 'svgtest2',
nodeBorderColorSel: '#FFB60B',
nodeColorSel: 'yellow',
/**
* Event handling code.
*/
....
svg.handlebar示例:
<?xml version="1.0" encoding="ISO-8859-1" standalone="no"?><svg xmlns="http://www.w3.org/2000/svg" version="1.1" x="manifold" xmlns:xlink="http://www.w3.org/1999/xlink" >
tank_1</text>
<circle cy="25" cx="70" r="20" id="tank_1" strokewidth:5; fill:none; " />
<circle cy="25" cx="120" r="20" id="tank_10" strokewidth:5; fill:none; " />
<circle cy="25" cx="170" r="20" id="tank_11" strokewidth:5; fill:none; " />
... etc...
最佳答案
对我有用的是自己添加观察者到对象。
node.addObserver('selected', this, 'update_node_selected');
节点是一个记录。现在,我在选定属性上手动添加了一个观察者,并在此属性上执行了“update_node_selected”功能。它得到一个目标参数,该参数是对象,在我的情况下是一条记录。
关于javascript - 检测数据存储中记录的更改,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/7360734/