聚合物模板:内容插入点的有效选择 [英] Polymer Template: What are valid selects for content insertion points

问题描述

这可能是一个非常简单的问题，尽管我可以找到一些简单的示例，但在Polymer Project网站上找不到此文档.在元素模板中，您可以使用:

This may be fairly simple question, and though I can find some simple examples, I cannot find documentation on this on the Polymer Project website. In the template for an element, you may use:

<content select="value"></content>

我的问题是select属性的有效值是多少.它仅仅是一个元素吗?可以是任何简单的CSS选择器(例如"#id")吗?可以是一个绑定值("{{data}}")吗?

My question is what are valid values for the select attribute. Is it simply an element? Can it be any simple CSS selector (such as "#id")? Can it be a bound value ("{{data}}")?

虽然最终我只是在寻找答案，但我也很乐意接受文档引文或URL.

While, ultimately, I'm just looking for the answer, I would also gladly accept a document citation or URL.

推荐答案

W3C影子DOM 规范的链接，该规范指出了插入点的有效选择器是:

A little bit of documentation on the polymer website is hidden away in the Your first Polymer app section. There is a link to the W3C Shadow DOM specification which says valid selectors for insertion points are:

• 类型选择器或通用选择器(a，div等)
• 类选择器(例如.my-class)
• ID选择器(例如#myid)
• 属性选择器(例如[myboolattr]，[myattr="myvalue"])
• 否定伪类:not()

• A type selector or a universal selector (a, div etc.)
• class selector(s) (e.g. .my-class)
• An ID selector (e.g. #myid)
• attribute selector(s) (e.g. [myboolattr], [myattr="myvalue"])
• A negation pseudo-class, :not()

您可以在select属性中具有多个选择器，例如:

You could have multiple selectors in the select attribute, for example:

<content select='div,.my-class,#myid,[name="myname"]'></content>

绑定也有效:

<content select="{{ mySelector }}"></content>

A *选择所有内容:

<content select="*"></content>

这篇关于聚合物模板:内容插入点的有效选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！