开发应用时,UCD给到我们的样式经常使用子类选择器“>”,如果所有组件都用自定义的标签选择器,开发人员无疑要对很多样式做调整。

  Angular2组件化除了自定义标签,还可以在selector元数据里配置样式、属性的调用方式。selector总共有6种配置方式:

  • selector: 'element-name'//自定义标签选择器
  • selector: '.class'//样式选择器
  • selector: '[attribute]'//属性选择器
  • selector: '[attribute=value]'//属性值选择器
  • selector: ':not(sub_selector)'//取反选择器
  • selector: 'selector1, selector2'//多种选择器

  这里有个示例进一步说明:

@Component({
selector: 'test-component, .test-component, [test-component], [component="test"]'
template: `Hell Test Component!`
})
export class TestComponent {}

  用以下任何一种方式调用TestComponent组件,都能成功渲染。

  • <test-component></test-component>
  • <p test-component></p>
  • <p class="test-component"></p>
  • <p component="test"></p>

  使用自定义标签能让文档结构更清晰,推荐使用这种方式调用组件;而对于样式复杂的组件可以尝试使用非自定义标签的选择器。

  

Angular2-除了自定义标签,你还可以这样配置组件的选择器的更多相关文章

  1. django 组件 自定义过滤器 自定义标签 静态文件配置

    组件 将一些功能标签写在一个html文件里,这个文件作为一个组件,如果那个文件需要就直接拿过来使用即可: 这是title.html文件,写了一个导航栏,作为一个公用的组件 <div style= ...

  2. day58——模板继承、组件、自定义标签和过滤器、inclusion_tag、静态文件配置、url别名和反向解析、url命名空间

    day58 模板相关 模板继承(母版继承) 1. 创建一个xx.html页面(作为母版,其他页面来继承它使用) 2. 在母版中定义block块(可以定义多个,整个页面任意位置) {% block co ...

  3. Django 模板 语法 变量 过滤器 模板继承 组件 自定义标签和过滤器 静态文件相关

    本节目录 一 语法 二 变量 三 过滤器 四 标签Tags 五 模板继承 六 组件 七 自定义标签和过滤器 八 静态文件相关 一 语法   模板渲染的官方文档 关于模板渲染你只需要记两种特殊符号(语法 ...

  4. django之模板系统 --》内容(filter过滤器、tags标签【for、if、with】、母板以及继承、crf_token、注释、组件、静态文件【load static】、get_static_prefix、自定义标签和tag)

    常用: Django模板中只需要记两种特殊符号: {{ }}和 {% %} {{ }}表示变量,在模板渲染的时候替换成值,{% %}表示逻辑相关的操作. 变量 {{ 变量名 }} 变量名由字母数字和下 ...

  5. Spring 自定义标签配置

    前景:经常使用一些依赖于Spring的组件时,发现可以通过自定义配置Spring的标签来实现插件的注入,例如数据库源的配置,Mybatis的配置等.那么这些Spring标签是如何自定义配置的?学习Sp ...

  6. Django:母版、继承、组件、自定义标签

    1.for循环应用 1.1for Variable Description forloop.counter 当前循环的索引值(从1开始) forloop.counter0 当前循环的索引值(从0开始) ...

  7. Django-模板继承/组件/自定义标签

    一.标签tags for标签 遍历每一个元素:  写个for,然后 tab键自动生成for循环的结构,循环很基础,就这么简单的用,没有什么break之类的,复杂一些的功能,你要通过js def get ...

  8. JavaEE自定义标签:标签类的创建、tld配置文件的创建(位置、如何创建)、Web-XML配置、JSP应用

    1.标签 以类似于html标签的方式实现的java代码的封装. 第一:形成了开发标签的技术标准---自定义标签的技术标准. 第二:java标准标签库(sun之前自己开发的一系列的标签的集合)jstl, ...

  9. Android 之 自定义标签 和 自定义组件

    1    自定义标签 这是我的模板项目目录     既然想像 android:text  那样使用自己的标签,那么首先得有标签. 在 res/values/ 下我新建了个 mm_tag.xml (切记 ...

随机推荐

  1. 一起学习《C#高级编程》2--比较对象的相等性

    今后争取每两天能更新一次.平日的诱惑太多,双休只顾玩了,进度有点慢. 接上一讲的,类型的安全性,留下了点小尾巴——比较对象的相等性. C#有四种比较相等的方式:除了“==”运算符外,System.Ob ...

  2. SQL Server中将多行数据拼接为一行数据并且有特殊字符

    有表结构如下: 这时,要求显示所有学生的爱好的结果集,代码如下: ) as hobby FROM ( SELECT name, (SELECT hobby+',' FROM student WHERE ...

  3. MvvmLight框架使用入门(二)

    上一篇我们简单对MvvmLight做了介绍.罗列了三个DLL中,各个命名空间下主要类的定义及大致作用.因为只是范范的概论,对于从未接触过MvvmLight的萌新来说,根本就是在晃点他们.不过万事开头难 ...

  4. “全栈2019”Java异常第二章:如何处理异常?

    难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java异 ...

  5. 【文文殿下】 [SDOI2016]生成魔咒

    字符集大小为1e9.............使用 map 吧 统计本质不同的子串个数是SAM的经典应用之一 本质不同的子串个数其实就是\(\sum max(x)-min(x)+1\) 所以我们新建结点 ...

  6. HDU 3007 模拟退火算法

    Buried memory Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Tot ...

  7. [VB6.0-->VB.NET]关于VB6.0升级到VB.NET的微软官方文档

    升级流程大体是这样的: 1.用VS2008打开Vb6.0的工程(此时针对语言层面自动升级). 注: VS更新多版了(当前最新VS2017),用最新版再打开2008升级后的工程的时候还是会有自动升级,相 ...

  8. 理解 atime,ctime,mtime (上)

    理解 atime,ctime,mtime (上) Unix文件系统会为每个文件存储大量时间戳.这意味着您可以使用这些时间戳来查找任意时间访问到的任何文件或目录(读取或写入),更改(文件访问权限更改)或 ...

  9. selenium常用命令--操作页面元素及获取元素内容整理

    selenium常用命令之操作页面元素及获取元素内容的事件整理 例子:  /**id <input type="text" id="phone" name ...

  10. JavaBean简介及使用

    JavaBean简介及使用  望星空 https://blog.csdn.net/joywy/article/details/7773503   一.JavaBean简介 JavaBean是使用Jav ...