कंपोनेंट की संरचना

तीन हिस्से

@Component इसे कॉन्फ़िगर करता है, टेम्पलेट HTML तय करता है, और क्लास डेटा व लॉजिक रखती है।

import { Component } from '@angular/core';

@Component({
  selector: 'app-greeting',
  standalone: true,
  template: `<h1>Hello, {{ name }}!</h1>`,
})
export class GreetingComponent {
  name = 'Angular';
}

सेलेक्टर और टेम्पलेट

selector वह कस्टम HTML टैग है जिसे दूसरे टेम्पलेट उपयोग करते हैं, जैसे <app-greeting>। template (या templateUrl) यह तय करता है कि क्या रेंडर होगा।

styleUrl भी

एक कंपोनेंट में आमतौर पर styleUrl: './greeting.component.css' भी होता है, जो केवल उसी कंपोनेंट के टेम्पलेट पर लागू स्कोप्ड CSS देता है।