调样式的过程中发现需要用到ViewEncapsulation…总结下到目前为止的经验…暂时还不太清楚里面的逻辑可能有错误.

在@Component中设置encapsulation有三种可选属性,看起来会造成对全局/当前组件/当前组件的子组件有不同影响.

ViewEncapsulation.None

这设置会将这个Component中的样式应用到全局,其它Component也会应用这个的css.但是否会影响到组件中用到的其它模块生成的html?

ViewEncapsulation.Emulated(Default)

这设置会将这个Component中的样式只应用到当前组件,连组件中用到的其它模块的样式也不会有影响.

ViewEncapsulation.Native

这设置会将这个Component中的样式应用到当前组件,并且连同组件中用到的其它模块的样式也会有影响.生成的DOM中,与iframe有点像(可能就是一个东西?)…叫做#shadow-root()…看起来,就像是这个组件是有自己的document,样式应用到这个document内的全局之中.

重点是这东西好像和ios的safari不兼容…设置后,没法打开…所以不能用…