selector 使用组件的方式

组件

推荐使用元素选择器

元素选择器

//ts
selector: 'app-stock-item'

<!--html-->
<app-stock-item>

在HTML中以css类的方式使用该组件

//ts
selector: '.app-stock-item'

<!--html-->
<div class="app-stock-item">

在HTML中以元素属性的方式使用该组件

//ts
selector: '[app-stock-item]'

<!--html-->
<div app-stock-item>

样式封装

默认，组件内的样式只对该组件起作用

encapsulation: ViewEncapsulation.Emulated

理想情况，angular会使用影子root(貌似我这的不支持)

encapsulation: ViewEncapsulation.Native

将组件内的样式设置为全局样式，可能会污染全局样式

encapsulation: ViewEncapsulation.None

组件和模块

当使用组件时，angular无法识别组件或表示他不认识某个元素，很可能是由于模块配置错误导致的，按如下顺序进行检查：
1、组件是否在declarations中声明
2、确保已经导入/导出这个组件的模块
3、如果再新module里面创建了新组件，确保将模块中的组件导出到了外部，其他地方引用新module就可以访问的到新组件