View Encapsulation rialann conas a bhíonn CSS an chomponainte fálaithe — go réamhshocraithe, scairtíonn Angular stíleanna gach componainte ar leith ionas nach dtéann siad amach go nó nach n-éiríonn siad faoi thionchar comhpháirteanna eile. Réitíonn sé seo an fhadhb raon fhéarsúil CSS.
({
: ,
: ,
: [],
})
{}
Leis an mód Emulated réamhshocraithe, ní dhéanfaidh an h2 { color: blue } seo difear do na <h2> i gcomhpháirteanna eile, agus ní dhéanfaidh stíleanna seachtracha isteach sa cheann seo.
<!-- Angular adds unique attributes to scope the styles -->
<app-card _nghost-abc>
<h2 _ngcontent-abc>Title</h2>
</app-card>
<style>h2[_ngcontent-abc] { color: blue; }</style> <!-- scoped by attribute -->
Cuireann Angular go huachairí gníomhachtúil attributes uathúla _ngcontent/_nghost leis na heilimintí den chomponainte agus athscríobhann sé a sheolasairí CSS chun nach bhfreagraíonn siad ach dóibh — ag samhlú ar stíleanna fálaithe gan gá a bheith ag brath ar Shadow DOM nádúrtha.
ViewEncapsulation.Emulated (default) → scoped via added attributes (works everywhere)
ViewEncapsulation.ShadowDom → real browser Shadow DOM (true isolation)
ViewEncapsulation.None → NO scoping — styles are global (leak everywhere)
/* style a child component's internals from the parent */
:host { display: block; } /* the component's own host element */
:host(.active) { ... } /* host with a class */
::ng-deep .child-class { color: red; } /* pierce into children (use sparingly — deprecated-ish) */
Styléann :host an eilimint fréimhe an chomponainte féin; cuireann ::ng-deep stíl tríd go forcéimlí (cumhachtach ach díshuíomhaithe — brisítear an fálaitheacht).
Is é View Encapsulation an fáth go bhfuil comhpháirteanna Angular sábháilte a stíleadh ar leithligh — is féidir leat h2 { color: blue } a scríobh i gcomponainte amháin gan imní a dhéanamh faoi gach <h2> san aip a bhríseadh.
Tá an tuiscint ar an mód Emulated réamhshocraithe (agus na roghanna None/ShadowDom, móide :host agus ::ng-deep do na heisceachtaí adhbhartha) tábhachtach chun stíleanna a bhainistiú i bhfeidhmchláir mhóra agus chun leabharlanna comhpháirteanna a thógáil ina mbeadh sceitheadh stíl ina fhadhb dháiríre.