如何关闭Angular 2中一个属性的视图封装？

Question

我有以下样式:

#right_content {
  padding: 30px 40px !important;
}

我把它存储在一个register.css绑定到我的文件中register.ts.

问题是它<div id="right_content">位于父模块中,这意味着我无法从内部直接修改其CSS属性register.ts.

<div id="right_content">
  <router-outlet></router-outlet>
</div>

我的register.html,register.css进入路由器插座.我想的样式#right_content从register.css.

有没有什么方法可以关闭视图封装(或者无论_ngcontent-mxo-3是否调用属性的添加),只是针对上述样式？

Answer 1

更新

::slotted 现在所有新浏览器都支持它,并且可以与`ViewEncapsulation.ShadowDom一起使用

https://developer.mozilla.org/en-US/docs/Web/CSS/::slotted

原版的

支持创建通过组件边界的选择器,即使ViewEncapsulation是Emulated(默认)

child-component ::ng-deep #right_content {
  padding: 30px 40px !important;
}

允许<xxx id="right_content">从任何祖先平铺