[英]What is the valid selector type for `selector` property in angular2 component
I'm reading in a book about selector
property of a component that: 我正在阅读有关组件的
selector
属性的书:
With the selector key, you indicate how your component will be recognized when rendering HTML templates.
使用选择器键,指示在呈现HTML模板时如何识别您的组件。 The idea is similar to CSS or XPath selectors.
这个想法类似于CSS或XPath选择器。 The selector is a way to define what elements in the HTML will match this component.
选择器是定义HTML中的哪些元素将与此组件匹配的方法。 In this case, by saying selector: 'inventoryapp', we're saying that in our HTML we want to match the inventory-app tag, that is, we're defining a new tag that has new functionality whenever we use it.
在这种情况下,通过说选择器:“ inventoryapp”,我们说的是在我们的HTML中,我们要匹配stock-app标签,即,我们定义了一个在使用时具有新功能的新标签。
So I put in CSS selector 所以我放入CSS选择器
@Component({
selector: 'span[my-app].z',
template: `<h1>Hello {{name}}</h1>`,
})
and it worked. 而且有效。
So I'm interested to know if the full CSS selectors syntax is supported. 因此,我想知道是否支持完整的CSS选择器语法。
Short answer: Yes. 简短的回答:是的。
According to angular2 docs: https://angular.io/docs/ts/latest/guide/cheatsheet.html 根据angular2 docs: https ://angular.io/docs/ts/latest/guide/cheatsheet.html
Directive configuration : 指令配置 :
selector: '.cool-button:not(a)'
Specifies a CSS selector that identifies this directive within a template.
指定一个CSS选择器,用于在模板中标识此伪指令。 Supported selectors include element, [attribute], .class, and :not().
受支持的选择器包括元素,[属性] 、. class和:not()。 Does not support parent-child relationship selectors.
不支持父子关系选择器。
Note: The usual way to define a component selector is just by giving it a tag as you know. 注意:定义组件选择器的通常方法是给它一个如您所知的标签。 Like: selector:
"my-component"
and use it as <my-component>
inside the html. 像:选择器:
"my-component"
并将其用作html中的<my-component>
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.