Angular मा services र dependency injection के हुन्?

Question

Accepted Answer

A **service** एक क्लास हो **non-UI logic** को लागि — data fetching, business rules, shared state, logging — जो components ले पुनः प्रयोग गर्न सक्छन्। **Dependency Injection (DI)** यो हो कि Angular ले ती services लाई components मा कसरी *प्रदान गर्छ*, जसको सट्टामा components ले तिनलाई आफैले बनाउँदैनन्।

## एक service परिभाषित गरी

```ts
import { Injectable } from "@angular/core";

@Injectable({ providedIn: "root" }) // makes it a singleton available app-wide
export class UserService {
  private users = [];
  getUsers() { return this.users; }
  addUser(u) { this.users.push(u); }
}
```

`@Injectable({ providedIn: "root" })` decorator ले service लाई Angular को DI system मा एक single shared instance (singleton) को रूपमा पूरै app को लागि दर्ता गर्छ।

## यसलाई एक component मा inject गरी

```ts
@Component({ ... })
export class UserListComponent {
  // Angular sees this constructor param and INJECTS the singleton automatically
  constructor(private userService: UserService) {}

users = this.userService.getUsers(); // just use it
}
```

तपाई constructor parameter को रूपमा service लाई सरलै घोषणा गर्नुहुन्छ; Angular को DI ले **instance बनाई र आपूर्ति गर्छ**। तपाई कहिले पनि `new UserService()` लेख्नुहुन्न। (आधुनिक Angular ले constructor injection को सट्टामा `inject()` function पनि प्रयोग गर्न सक्छ।)

```ts
import { inject } from "@angular/core";
export class UserListComponent {
  private userService = inject(UserService); // alternative injection style
}
```

## DI किन मूल्यवान छ

```text
✓ Single source of truth — one shared UserService instance across components
✓ Loose coupling — components depend on the type, not on constructing it
✓ Testability — swap in a mock service in tests easily
✓ Lifecycle management — Angular handles creation and sharing
```

किनभने component ले आफ्नो dependencies construct गर्दैन, तपाई tests मा एक **fake** service inject गर्न सक्नुहुन्छ, वा एक स्थान मा app-wide implementation परिवर्तन गर्न सक्नुहुन्छ।

## यो किन महत्वपूर्ण छ

Services + DI Angular architecture मा केन्द्रीय छन्: components UI मा केन्द्रित रहन्छन् जबकि services मा logic र state राख्छन्, र DI ले तिनलाई minimal coupling सँग जोडिदिन्छ।

यो separation (र यसले ल्याउने testability) Angular को परिभाषित शक्ति हो — backend frameworks बाट लिइएको — र `@Injectable({ providedIn: 'root' })` एक shared, injectable singleton को लागि रोजमर्रा को pattern हो।