文章内容
2017/6/19 17:10:02,作 者: 黄兵
Angular 2 组件
Angular起初是以Web Component标准为蓝本进行设计的，在Angular中引入了视图包装（ViewEncapsulation）的概念，允许通过设置ViewEncapsulation.Navtive来使用原生的Shadow DOM.
首先上一段代码，如下：
import {Component} from '@angular/core';
@Component({
selector:'contact-item',
template: '<div><p>黄兵</p><p>13429950072</p></div>'
})
export class ContactItemComponent{}
以上代码创建了一个简单的Angular组件。使用这个组件，需要在HTML中添加自定义标签，然后Angular便会在此标签中插入ContactItemComponent组件中指定的模板。
在HTML中使用ContactItemComponent组建的示例代码如下：
<div>
<contact-item></contact-item>
</div>
以上就是组件的简单介绍。
后面的文章将会详细的介绍组件的具体内容。
黄兵的个人博客。
转载请注明出处：黄兵的个人博客 - Angular 2 组件
参考资料：揭秘Angular 2
广发证券互联网金融技术团队 著
ISBN:978-7-121-30650-1
评论列表