Çfarë është një komponent Angular?

Question

Accepted Answer

Një **komponent** është ndërtesa themelore e Angular UI — një **klasë** TypeScript e zbukuruar me `@Component` që kontrollon një seksion të ekranit ("pamja" e tij). Çdo aplikacion Angular është një pemë komponentesh. ## Anatomia e një komponenti ```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 } ``` Dekoruesi `@Component` lidh tre gjëra bashkë: një **selector** (si e përdorni në HTML), një **template** (markimi), dhe **stile** (të limituar në këtë komponent). ## Klasa përmbajnë logjikën dhe të dhënat ```html

``` Proprietetet dhe metodat publike të klasës janë drejtpërdrejt të arritshme në template-in e saj përmes binding-ut — ky është thelbi se si Angular lidh të dhënat dhe pamjen. ## Përdorimi i një komponenti ```html ``` ## Stilet janë të kapsuluara si parazgjedhje ```css /* user-card.css — these styles ONLY affect this component */ h2 { color: blue; } /* won't leak to other components'

s */ ``` Angular kufizon stilet e komponentës automatikisht (View Encapsulation), kështu që CSS nuk rrjedh ndërmjet komponentesh. ## Pse është e rëndësishme Komponentet janë mënyra si strukturoni çdo aplikacion Angular — njësi të pavarura të template + logjikës + stileve të kufizuara, të përqasuara në një pemë. Përndarja e dekorusit `@Component` (selector, template, stile) dhe si lidhën prona/metodat e klasës me template-in është themeli absolutë i zhvillimit Angular; gjithçka tjetër ndërtohet në modelin e komponenteve.