Kaj je Angular komponenta?

Question

Accepted Answer

**Komponenta** je temeljni gradnik Angular UI-ja — TypeScript **razred** dekoriran s `@Component`, ki kontrolira del zaslona (njegov "pogled"). Vsaka Angular aplikacija je drevo komponent. ## Anatomija komponente ```ts import { Component } from "@angular/core"; @Component({ selector: "app-user-card", // the custom HTML tag: templateUrl: "./user-card.html", // the view (or inline `template: '...'`) styleUrls: ["./user-card.css"], // scoped styles for this component }) export class UserCardComponent { name = "Ann"; // properties → available in the template greet() { return `Hi ${this.name}`; } // methods → callable from the template } ``` Dekorator `@Component` povezuje tri stvari: **selektor** (kako ga uporabite v HTML-u), **predlogo** (oznako) in **stile** (omejene na to komponento). ## Razred vsebuje logiko in podatke ```html

``` Javne lastnosti in metode razreda so neposredno dostopne v njegovi predlogi prek povezovanja — to je jedro tega, kako Angular povezuje podatke in pogled. ## Uporaba komponente ```html ``` ## Stili so privzeto hermetični ```css /* user-card.css — these styles ONLY affect this component */ h2 { color: blue; } /* won't leak to other components'

s */ ``` Angular samodejno scopa sloge komponente (View Encapsulation), zato CSS ne pusti med komponente. ## Zakaj je to pomembno Komponente so način, kako strukturirate vsako Angular aplikacijo — samostojne enote predloge + logike + scoped stilov, sestavljene v drevo. Razumevanje dekoratorja `@Component` (selektor, predloga, stili) in kako se lastnosti/metode razreda povezujejo s predlogo, je absolutni temelj Angular razvoja; vse ostalo se gradi na modelu komponent.