在另一个组件中以不同方式设置子组件的样式

Question

我正在尝试设置我的alert 框（来自引导程序）[这也是一个组件]，当它出现在我的一个组件中时略有不同。对于其他地方，我想使用它的默认样式。

我可以通过以下方式实现我想要的：

encapsulation: ViewEncapsulation.None 在我的父组件中。但是我真的很想避免它并学习使用最佳实践来做到这一点。

谁能解释一下如何在不修改encapsulations的情况下实现这一点？

在一些帖子中，用户提到使用 :host 和 ::content css 属性，但到目前为止我无法使用它们。

我相信这是一个非常常见的场景，应该有一个很好的方法来做到这一点。

Answer 1

你可以在父类中使用/deep/

:host /deep/ some-grand-child {
  color: blue;
}

在不将ViewEncapsulation 设置为None 的情况下使选择器跨越组件边界。