以下是什么用例：主角上下文选择器

Question

我看到了一个有说服力的道理课程：

  

host-context用于为组件内的元素设置样式，具体取决于在其外部设置的某些条件。

我在https://angular.io

中搜索了官方文档

但没有记录

可以解释一下我可以将这个选择器用于角度分量的不同用例吗？

有人可以解释在这里添加到主持人的-context的全部含义吗？

没有官方文档，这是否意味着当有人提供一个用例时，这意味着它是该事物所指的唯一案例？

Answer 1

This answer解释了host和host-context之间的区别。以下是host-context用法的示例。假设您有一个包装输入的组件，这个输入可以在两个不同的组件中使用 - 表和下拉列表。当在下拉列表中时，它应该占据宽度的50％，在表格中 - 100％。现在，如果你有这两个组件选择器定义如下：

<my-dropdown>
<my-table>

然后可以像这样定义输入组件的样式：

:host-context(my-dropdown) input { width: 50% }
:host-context(my-table) input { width: 100% }