我们可以将<content>放在<shadow>标签内吗？</shadow> </content>

Question

有没有办法将<content select=".someClass"></content>之类的内容放在聚合物模板中的<shadow>标记内，如下所示：

<shadow>
    <content select=".someClass"></content>
</shadow>

如果是这样怎么样？因为当我尝试它时根本没有显示。

Answer 1

没有声明性的方法来做到这一点。通过选择<shadow>中存在的元素，然后使用getDistributedNodes()将内容从插入点中拉出并将其附加到该已知元素，可以使用JavaScript。

在聚合物中，你可以很容易地利用automatic node finding

来做到这一点

如果您知道父元素中包含id foo的元素，您可以执行以下操作：

// hacky pseudo code
// assuming you have a <content id="content"> element
var content = this.$.content.getDistributedNodes().array();
content.forEach(function(node) {
  this.$.foo.appendChild(node);
}.bind(this));