Events Polymer:WebComponentsReady或使用innerHTML添加元素时的类似事件_Events_Polymer_Upgrade_Element_Innerhtml

Events Polymer:WebComponentsReady或使用innerHTML添加元素时的类似事件

events polymer

Events Polymer:WebComponentsReady或使用innerHTML添加元素时的类似事件,events,polymer,upgrade,element,innerhtml,Events,Polymer,Upgrade,Element,Innerhtml,我目前在玩Polymer的时候遇到了一个问题——事实上，当我在Firefox或IE（11）中尝试Chrome时，我发现一切都像我预期的那样工作下面是一个小演示来重现我的问题： “Webcomponents已准备好使用！”框在页面加载后立即显示（但实际上这并不重要，因为此时页面上还没有自定义元素）单击“插入聚合物”按钮时，将使用innerHTML将纸张输入元素添加到页面中-一旦打印标签（请参阅调用alertLabel（）），它将打印“未定义”（我猜该元素尚未升级）。之后，当我单击“警报标签”按

我目前在玩Polymer的时候遇到了一个问题——事实上，当我在Firefox或IE（11）中尝试Chrome时，我发现一切都像我预期的那样工作

下面是一个小演示来重现我的问题：

“Webcomponents已准备好使用！”框在页面加载后立即显示（但实际上这并不重要，因为此时页面上还没有自定义元素）

单击

“插入聚合物”

按钮时，将使用

innerHTML

将纸张输入元素添加到页面中-一旦打印标签（请参阅调用

alertLabel（）

），它将打印“未定义”（我猜该元素尚未升级）。之后，当我单击

“警报标签”

按钮时，它会按预期工作



    <html>
<head>
    <meta charset="utf-8">

    <title>Test</title>

    <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>

    <link rel="import" href="bower_components/polymer/polymer.html">
    <link rel="import" href="bower_components/paper-input/paper-input.html">

    <script>
        window.addEventListener('WebComponentsReady', function(){alert('Webcomponents are ready to use!');});
    </script>
</head>
<body unresolved>
<button id="insertelement" onclick="insertPolymerElement();">Insert Polymer</button>
    <button id="button" onclick="alertLabel();">Alert label</button>
    <div id="placeholder"></div>
    <script>
        function insertPolymerElement(){
            document.getElementById('placeholder').innerHTML = '<paper-input id="testinput" label="I\'m the label!"></paper-input>';
            alertLabel();
        }

        function alertLabel(){
            alert(document.getElementById('testinput').label);
        }
    </script>
</body>
</html>


试验
addEventListener（'WebComponentsReady'，function（）{alert（'Webcomponents已准备好使用！'）；}）；
插入聚合物
警告标签
函数insertpolymerement（）{
document.getElementById（'placeholder'）。innerHTML=''；
alertLabel（）；
}
函数alertLabel（）{
警报（document.getElementById（'testinput'）.label）；
}

所以问题是：如何确定何时可以与添加的元素交互WebComponentsReady事件将不再触发

谢谢你的帮助

我现在也有同样的问题。你解决过这个问题吗？