我很难让我的聚合物自定义元素在容器<div>
内呈现内容而不会在轻型DOM中显示<div>
。
<polymer-element name="impress-slide" constructor="ImpressSlide" attributes="exitAnimation entryAnimation">
<link rel="stylesheet" href="animate-custom.css">
<template>
<style type="text/css">
...
</style>
<div>
<content></content>
</div>
</template>
<script type="text/javascript">
...
</script>
</polymer-element>
呈现为
<impress-slide>
<div> (Content) </div>
</impress-slide>
任何人都可以让我深入了解如何在shadow DOM中呈现包含<div>
的内容吗?
答案 0 :(得分:3)
这取决于什么浏览器&amp;你正在使用的版本。其中一些版本具有旧版本的Shadow DOM规范,因此Polymer必须对其进行填充,而不是原生使用它来获得所需的功能。
我正在使用Chrome 33.0.1750.22 dev并且Shadow DOM仍为我填充,除非我打开about:flags
中的“启用实验性网络平台功能”标记。
答案 1 :(得分:0)
包含
<script>
window.Polymer = {
dom: 'shadow',
lazyRegister: true
};
</script>
<link rel="import" href="./bower_components/polymer/polymer.html">
在聚合物导入之前,允许自定义元素在阴影dom aka #shadow-root