🔧 Angular Services – Der unterschätzte Backbone deiner Architektur

(Warum Services mehr sind als nur ein „Data Layer“)

Viele denken bei Services nur an „Daten holen“.
Doch richtig eingesetzt, sind Services das Herz deiner Business-Logik.

1️⃣ Was ein Service wirklich ist

Ein Angular Service ist:

• Singleton (per default)
• Wiederverwendbar
• Injectable
• Perfekt für:
  • State Management
  • Business-Logik
  • Kommunikation mit Backend/API
  • Shared Logic zwischen Komponenten

2️⃣ Best Practices für Angular Services

✅ Eine Aufgabe pro Service (Single Responsibility)
✅ Keine UI-Logik im Service
✅ Immer mit Interfaces arbeiten
✅ RxJS sauber einsetzen (z.B. BehaviorSubject, shareReplay)

3️⃣ Beispiel: AuthService mit Signals

@Injectable({ providedIn: 'root' })
export class AuthService {
  private user = signal<User | null>(null);

  login(credentials: LoginDto) {
    this.http.post<User>('/api/login', credentials).subscribe(this.user);
  }

  get currentUser() {
    return computed(() => this.user());
  }
}

4️⃣ Anti-Pattern vermeiden

🚫 Services, die alles können wollen (AppService)
🚫 Logik doppelt in Component & Service
🚫 Zugriff auf DOM oder UI im Service

5️⃣ Service + Signals + Store = ❤️

Mit SignalStore oder Services mit Signals steuerst du:

• 🧠 Den Zustand
• 🔁 Die Synchronisation mit dem Backend
• 🧪 Die Testbarkeit

Fazit

Services sind nicht nur „Helper“, sondern der logische Kleber deiner App.
Mit sauberem Design sind sie mächtig, wartbar und der geheime Hebel für Skalierung.

📦 Nächster Beitrag:
🔁 Angular Lifecycle – Was wirklich wann passiert (und warum du es wissen musst)