<demo-snippet>中的元素仅在IE11中未正确克隆/投影

时间:2016-10-07 11:08:06

标签: javascript polymer polymer-1.0

我认为该元素未在IE11中正确投影。请看以下示例:

<body unresolved>

  <p>If this demo works correctly, you should be able to see the message <code>"Hello there. Hola!"</code></p>

  <p>
    This works as expected in all browsers except Internet Explorer 11 (maybe 10, although I didn't test). The issue is that when I assign helloElement.value, helloElement is not the same element that is being appended to the dome after is projected inside
    the &lt;demo-snippet&gt;.
  </p>

  <demo-snippet>
    <template is="dom-bind">
      <hello-element></hello-element>

      <script>
        var helloElement = document.querySelector('hello-element');
        helloElement.value = 'Hola!';

        // Wait enough time to make sure demo-snipper is rendered properly
        setTimeout(function() {
          console.log(helloElement === document.querySelector('hello-element')) // this is true in all browsers. In IE11 is false.
        }, 3000)
      </script>
    </template>

  </demo-snippet>
</body>

它发生的是helloElement.value中分配的值被复制到除IE11之外的所有浏览器中的demo-snippet元素内的投影元素中。这意味着,如果您添加一个就绪处理程序,那么

ready: function () {
   console.log(this.value) // --> 'Hola!' except IE11, that is ''
}

在将代码投射到内部时,这是Polymer或demo-snippet中的错误吗?或什么时候附在dom上?我真的不知道:(

您可以在此Plunker中使用我的示例:https://plnkr.co/edit/5UBCDjqC0A8k6HcaHnIJ?p=preview

1 个答案:

答案 0 :(得分:0)

显然,IE对此更为严格。您需要调用element.setAttribute而不是仅将其添加到对象中。

这将确保聚合物选择默认值作为属性。