Çfarë është projeksioni i përmbajtjes me ng-content?

Question

IT Interview Practice · Accepted Answer

**Projeksioni i përmbajtjes** lejon një komponent të pranojë dhe të shfaqë **shënimet e kaluar nga komponenti prind** — të vendosura përmes ``. Këtu është se si ndërton komponentë përmbështjellëse fleksibël dhe të përdorshme sërish (karta, dialogje, paraqitje) - përmbajtja e brendshme e kontrolluarmë konsumatorin. (Është ekuivalenti i Angular për sllotet e Vue/web-component dhe `children` të React.) ## Projeksioni me një slot ```ts // card.component.ts @Component({ selector: "app-card", template: `

`, }) export class CardComponent {} ``` ```html

Title

Any content I want!

``` Karta ofron përmbështjellësin me stil; komponenti prind vendos se çfarë vazihdej brenda — shumë më fleksibël se kalimi i vargrave përmes `@Input`. ## Projeksioni me shumë slote me `select` ```ts @Component({ selector: "app-panel", template: `

`, }) export class PanelComponent {} ``` ```html

My Panel

Main body content

``` Atributi `select` (një zgjedhës CSS — atribut, klasë, ose etiketë) drejton secilën pjesë të përmbajtjes të projektuar në slot-in e duhur ``, duke mundësuar paraqitje me shumë rajone. ## Përmbajtja e projektuar e mban kontekstin origjinal ```text Projected content is created in the PARENT's context — its bindings, methods, and lifecycle belong to the parent, not the wrapper component. ``` ## Pse është e rëndësishme Projeksioni i përmbajtjes është çelësi për ndërtimin e komponentëve të **përdorshëm sërish, të komponueshëm** në Angular — karta, modale, skeda, paraqitje, dhe çdo "guaskë" ku konsumatori siguron përmbajtjen e brendshme. Pa të, komponentët do të ishin të ngurtë (vetëm të konfigurueshëm përmes hyrjesh); me `` (dhe `select` për shumë slote), ato bëhen kontejnerë fleksibël, çka është thelbësore për sistemet e dizajnit dhe biblioteka të komponentëve të ndara.

Projeksioni me një slot

Projeksioni me shumë slote me select

Përmbajtja e projektuar e mban kontekstin origjinal

Pse është e rëndësishme

Pyetje të ngjashme

Projeksioni me shumë slote me `select`