角度元素-ViewEncapsulation

Question

我制作了一个Angular Elements Web组件。除了样式外，它的效果还不错。只有使用ViewEncapsulation.None时，样式才真正起作用。但是，这样做时，样式会受到父网页的影响。

有没有办法使Angular Component完全独立于父网页样式？

提前谢谢...

Answer 1

1。如果您希望您的angular元素从父范围继承样式，但又不想将其自身的样式泄漏给父范围：

ViewEncapsulation.Emulated

2。如果您希望角度元素与父元素完全独立：

ViewEncapsulation.ShadowDom

3。如果您想让Angular元素仅从父级作用域继承基本元素样式（标签）：

ViewEncapsulation.Emulated

并确保元素中的所有样式均以唯一名称作为前缀。这样一类.hero变成了my-uniq-hero。

  

ViewEncapsulation.Emulated是默认值，因此您无需显式设置它。