我们可以放吗 <content> 里面 <shadow> 标签？

Question

Is there a way to put something like <content select=".someClass"></content> inside a <shadow> tag in a polymer template like so:

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

If so how? because when I try it doesn't show at all.

Answer 1

There's no declarative way to do this. It is possible to do it with JavaScript by selecting an element that you know exists in the <shadow> and then using getDistributedNodes() to pull the content out of your insertion point and append it to that known element.

In Polymer you can do this pretty easily leveraging automatic node finding

If you know that the parent element has an element in it with an id of foo you could do something like this:

// 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));