开发应用时,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-除了自定义标签,你还可以这样配置组件的选择器的更多相关文章
-
django 组件 自定义过滤器 自定义标签 静态文件配置
组件 将一些功能标签写在一个html文件里,这个文件作为一个组件,如果那个文件需要就直接拿过来使用即可: 这是title.html文件,写了一个导航栏,作为一个公用的组件 <div style= ...
-
day58——模板继承、组件、自定义标签和过滤器、inclusion_tag、静态文件配置、url别名和反向解析、url命名空间
day58 模板相关 模板继承(母版继承) 1. 创建一个xx.html页面(作为母版,其他页面来继承它使用) 2. 在母版中定义block块(可以定义多个,整个页面任意位置) {% block co ...
-
Django 模板 语法 变量 过滤器 模板继承 组件 自定义标签和过滤器 静态文件相关
本节目录 一 语法 二 变量 三 过滤器 四 标签Tags 五 模板继承 六 组件 七 自定义标签和过滤器 八 静态文件相关 一 语法 模板渲染的官方文档 关于模板渲染你只需要记两种特殊符号(语法 ...
-
django之模板系统 --》内容(filter过滤器、tags标签【for、if、with】、母板以及继承、crf_token、注释、组件、静态文件【load static】、get_static_prefix、自定义标签和tag)
常用: Django模板中只需要记两种特殊符号: {{ }}和 {% %} {{ }}表示变量,在模板渲染的时候替换成值,{% %}表示逻辑相关的操作. 变量 {{ 变量名 }} 变量名由字母数字和下 ...
-
Spring 自定义标签配置
前景:经常使用一些依赖于Spring的组件时,发现可以通过自定义配置Spring的标签来实现插件的注入,例如数据库源的配置,Mybatis的配置等.那么这些Spring标签是如何自定义配置的?学习Sp ...
-
Django:母版、继承、组件、自定义标签
1.for循环应用 1.1for Variable Description forloop.counter 当前循环的索引值(从1开始) forloop.counter0 当前循环的索引值(从0开始) ...
-
Django-模板继承/组件/自定义标签
一.标签tags for标签 遍历每一个元素: 写个for,然后 tab键自动生成for循环的结构,循环很基础,就这么简单的用,没有什么break之类的,复杂一些的功能,你要通过js def get ...
-
JavaEE自定义标签:标签类的创建、tld配置文件的创建(位置、如何创建)、Web-XML配置、JSP应用
1.标签 以类似于html标签的方式实现的java代码的封装. 第一:形成了开发标签的技术标准---自定义标签的技术标准. 第二:java标准标签库(sun之前自己开发的一系列的标签的集合)jstl, ...
-
Android 之 自定义标签 和 自定义组件
1 自定义标签 这是我的模板项目目录 既然想像 android:text 那样使用自己的标签,那么首先得有标签. 在 res/values/ 下我新建了个 mm_tag.xml (切记 ...
随机推荐
-
WinForm 问题集锦
[1]重用项目窗体解决方案: 1. 把FmMain.cs 和 FmMain.Designer.cs 和 FmMain .resx 三个文件复制到程序目录下: 2. 在vs里面添加现有项, 选择FmMa ...
-
JDBC的事务处理
JDBC的事务处理 事务,也是数据库事务,指的是作为单个逻辑工作单元执行的一系列操作.正常的情况下,操作应该顺利进行,与操作相关的所有数据库信息也成功地更新: 但是,如果在这一系列过程中任何一个环节出 ...
-
重点关注之Filter的使用(性能计数和错误处理)
Web API中的filter与MVC中的filter非常类似,最主要的不同是,MVC中的filter放在命名空间System.Web.Mvc下,而Web API中的filter则放在命名空间Syst ...
-
CentOS中的chkconfig命令
chkconfig: chkconfig命令主要用来更新(启动或停止)和查询系统服务的运行级信息.谨记chkconfig不是立即自动禁止或激活一个服务,它只是简单的改变了符号连接.语法: ...
-
SQL注入中利用XP_cmdshell提权的用法(转)
先来介绍一下子服务器的基本情况,windows 2000 adv server 中文版,据称 打过了sp3,asp+iis+mssql .首先扫描了一下子端口,呵呵,开始的一般步骤. 端口21开放: ...
-
UIButton图文上下对齐
- (void)centerImageAndTitle:(float)spacing { // get the size of the elements here for readability CG ...
-
编写css代码的方式
css(层叠样式表) 在一个网页中主要负责了页面的数据样式. 编写css代码的方式: 第一种: 在style标签中编写css代码. 只能用于本页面中,复用性不强 ...
-
Optipng—PNG的优化图像工具初探
PNG 即 Portable Network Graphic 的简称,PNG 图像是一种无损压缩图像文件格式.因为网络传输的需要,我们总是希望 PNG 图像的容量能够小些.小些.再小些.要优化 PNG ...
-
美团、java后台实习、面经
3月27号投了美团java后台,29号收到面试邀请,好像是金融服务平台(提交简历的时候,我当时没注意随便填的···) 一面: 介绍项目经历 根据简历问一些问题:比如我简历上有区块链相关,会要求介绍一下 ...
-
阿里云对象存储 OSS 应用服务器搭建代码
背景说明 最近做一个APP客户端图片直传阿里云OSS的服务,需要在后台开一个阿里云的OSSToken获取的接口. 阿里云官方文档地址:快速搭建移动应用直传服务. 略过移动端说明,直接看服务端的. 不是 ...