如何动态创建聚合物元素
How to dynamically create a polymer element
我正在尝试使用
创建具有 javascript 的 paper-toast
元素
var toast = document.createElement('paper-toast');
成功创建元素,然后我在设置一些属性后将其添加到正文中。
document.body.appendChild(toast);
这也有效,该元素显示在 DevTools 中。但是,当我尝试调用
toast.show();
即使延迟(使用 setTimeout(1))它也会出错,undefined is not a function,因为新创建的元素不具有根据 documentation.[=15 应有的函数属性=]
现在如何使用元素的显示方法?它不必动态创建,我只需要能够完全更改内容,这似乎是一个简单的解决方案。
务必使用 html 导入来导入元素定义。
<link rel="import" href="components/paper-toast/paper-toast.html">
当您有很多自定义元素时,很难判断哪些缺少导入。您可以使用此小书签来检测丢失的导入
https://gist.github.com/ebidel/cea24a0c4fdcda8f8af2
javascript:(function()%7Bfunction%20isUnregisteredCustomElement(el)%7Bif(el.constructor==HTMLElement)%7Bconsole.error('Found%20unregistered%20custom%20element:',el);return%20true;%7Dreturn%20false;%7Dfunction%20isCustomEl(el)%7Breturn%20el.localName.indexOf('-')!=-1%7C%7Cel.getAttribute('is');%7Dvar%20allCustomElements=document.querySelectorAll('html%20/deep/%20*');allCustomElements=Array.prototype.slice.call(allCustomElements).filter(function(el)%7Breturn%20isCustomEl(el);%7D);var%20foundSome=false;for(var%20i=0,el;el=allCustomElements[i];++i)%7Bif(isUnregisteredCustomElement(el))%7BfoundSome=true;%7D%7Dif(foundSome)%7Balert('Oops:%20found%20one%20or%20more%20unregistered%20custom%20elements%20in%20use!%20Check%20the%20console.');%7Delse%7Balert('Good:%20All%20custom%20elements%20are%20registered%20:)');%7D%7D)();
我正在尝试使用
创建具有 javascript 的paper-toast
元素
var toast = document.createElement('paper-toast');
成功创建元素,然后我在设置一些属性后将其添加到正文中。
document.body.appendChild(toast);
这也有效,该元素显示在 DevTools 中。但是,当我尝试调用
toast.show();
即使延迟(使用 setTimeout(1))它也会出错,undefined is not a function,因为新创建的元素不具有根据 documentation.[=15 应有的函数属性=]
现在如何使用元素的显示方法?它不必动态创建,我只需要能够完全更改内容,这似乎是一个简单的解决方案。
务必使用 html 导入来导入元素定义。
<link rel="import" href="components/paper-toast/paper-toast.html">
当您有很多自定义元素时,很难判断哪些缺少导入。您可以使用此小书签来检测丢失的导入
https://gist.github.com/ebidel/cea24a0c4fdcda8f8af2
javascript:(function()%7Bfunction%20isUnregisteredCustomElement(el)%7Bif(el.constructor==HTMLElement)%7Bconsole.error('Found%20unregistered%20custom%20element:',el);return%20true;%7Dreturn%20false;%7Dfunction%20isCustomEl(el)%7Breturn%20el.localName.indexOf('-')!=-1%7C%7Cel.getAttribute('is');%7Dvar%20allCustomElements=document.querySelectorAll('html%20/deep/%20*');allCustomElements=Array.prototype.slice.call(allCustomElements).filter(function(el)%7Breturn%20isCustomEl(el);%7D);var%20foundSome=false;for(var%20i=0,el;el=allCustomElements[i];++i)%7Bif(isUnregisteredCustomElement(el))%7BfoundSome=true;%7D%7Dif(foundSome)%7Balert('Oops:%20found%20one%20or%20more%20unregistered%20custom%20elements%20in%20use!%20Check%20the%20console.');%7Delse%7Balert('Good:%20All%20custom%20elements%20are%20registered%20:)');%7D%7D)();