@Directive और @Component Angular में: क्या अंतर है और कब क्या उपयोग करें?
सभी को नमस्कार! मैंने Angular और TypeScript सीखना शुरू किया है, और अपने पहले components और directives बनाते समय मैं `@Component` और `@Directive` डेकोरेटरों के बीच अंतर को लेकर भ्रमित हो गया। दस्तावेज़ में लिखा है कि `@Component` `@Directive` का एक subclass है, लेकिन व्यवहार में इनका उपयोग अलग-अलग तरीके से होता है।
उदाहरण के लिए, मैं एक सरल बटन बना रहा हूँ जो hover करने पर रंग बदलता है। मैं इसे component और directive दोनों के माध्यम से कर सकता हूँ। यहाँ मेरा कोड है:
**@Component के साथ विकल्प:**
```typescript
import { Component } from '@angular/core';
@Component({
selector: 'app-hover-button',
template: ``,
styles: [`
.highlight { background-color: yellow; }
`]
})
export class HoverButtonComponent {
onHover() { /* क्लास जोड़ें */ }
onLeave() { /* क्लास हटाएं */ }
}
```
**@Directive के साथ विकल्प:**
```typescript
import { Directive, HostListener, HostBinding } from '@angular/core';
@Directive({
selector: '[appHover