如何动态创建聚合物元素

时间:2015-04-01 00:21:42

标签: javascript polymer

我正在尝试使用

创建一个带有javascript的paper-toast元素
var toast = document.createElement('paper-toast');

成功创建元素,然后在设置一些属性后将其添加到正文中。

document.body.appendChild(toast);

这也有效,该元素出现在DevTools中。但是,当我试着打电话时

toast.show();

即使延迟(使用setTimeout(1)),undefined的错误也不是函数,因为新创建的元素没有根据documentation应该具有的函数属性。

我现在如何使用元素的show方法?它不必动态创建,我只需要能够完全改变内容,这似乎是一个简单的解决方案。

1 个答案:

答案 0 :(得分:1)

请务必使用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)();