Що таке encapsulation в Angular-компонентах?

encapsulation в Angular-компонентах визначає, як стилі компонента застосовуються до DOM і ізолюються від інших компонентів.

Angular підтримує три режими:

1. ViewEncapsulation.Emulated (типово) - стилі компонента ізолюються віртуально за допомогою додавання атрибутів до елементів. Вони діють лише всередині компонента, але браузер бачить звичайний CSS.
2. ViewEncapsulation.None - стилі компонента глобальні та впливають на всі елементи застосунку, ізоляції немає.
3. ViewEncapsulation.ShadowDom - використовується нативний Shadow DOM браузера; стилі повністю ізольовані та не зачіпають інші компоненти.

Основна мета encapsulation - контролювати область дії CSS і запобігати конфліктам стилів між компонентами.