Javascript 可以在Polymer中动态创建本地/轻型DOM以确保正确绑定吗?
是否可以在自定义元素中修改JS中的local/lightJavascript 可以在Polymer中动态创建本地/轻型DOM以确保正确绑定吗?,javascript,polymer-1.0,Javascript,Polymer 1.0,是否可以在自定义元素中修改JS中的local/lightDOM,以处理动态添加的元素的绑定,就像它们在模板中指定一样 请考虑下面的代码段(自定义元素的一部分): 我希望添加的div使其内部HTML等于从方法\u computedValue返回的值。在创建div时无法分配该值,因为在实际情况下,它将取决于实时上下文。目前看来,Polymer 1.0不支持动态(强制)绑定。以及相关的讨论 来自上述链接的信息表明,通过使用dombindtemplate元素来创建具有绑定的动态内容是一种可靠的方法,尽管
DOM
,以处理动态添加的元素的绑定,就像它们在模板中指定一样
请考虑下面的代码段(自定义元素的一部分):
我希望添加的div
使其内部HTML等于从方法\u computedValue
返回的值。在创建div
时无法分配该值,因为在实际情况下,它将取决于实时上下文。目前看来,Polymer 1.0不支持动态(强制)绑定。以及相关的讨论
来自上述链接的信息表明,通过使用dombind
template元素来创建具有绑定的动态内容是一种可靠的方法,尽管这种方法有限。这种限制是由于绑定严格使用正在创建的dombind
实例的本地定义方法和属性
下面是一个示例,其中使用属性tapCount
、tapMessage
和方法\u tapMe
强制创建domBind
。后者用作添加到domBind
元素div
的on-tap
事件处理程序
attached: function () {
var domBind = document.createElement('template', 'dom-bind');
domBind.tapCount = 0;
domBind.tapMessage = 'Tap me now!';
domBind._tapMe = function(e) {
this.tapCount = this.tapCount + 1;
this.tapMessage = 'Tapped ' + this.tapCount + ' time(s).';
};
var div = domBind.content.ownerDocument.createElement('div');
div.innerHTML = '<b on-tap="_tapMe">[[tapMessage]]</b>';
domBind.content.appendChild(div);
Polymer.dom(this.$.container).appendChild(domBind);
Polymer.dom.flush();
}
然后通过绑定本地定义的externalMethod
可以从“外部”范围“绑定”事物。在这种情况下,\u computeValue
指的是在自定义元素上定义的方法,在其方法中附加了命令式轻DOM构造
attached: function () {
var domBind = document.createElement('template', 'dom-bind');
domBind.tapCount = 0;
domBind.tapMessage = 'Tap me now!';
domBind._tapMe = function(e) {
this.tapCount = this.tapCount + 1;
this.tapMessage = 'Tapped ' + this.tapCount + ' time(s).';
};
var div = domBind.content.ownerDocument.createElement('div');
div.innerHTML = '<b on-tap="_tapMe">[[tapMessage]]</b>';
domBind.content.appendChild(div);
Polymer.dom(this.$.container).appendChild(domBind);
Polymer.dom.flush();
}
...
var self = this;
domBind.externalMethod = function() {
return self._computeValue();
};
...