Was sind Signals
Verstehen Sie Signals als reaktive Container für Zustände.
Was sind Signals ist eine kostenlose Angular Academy-Lektion auf CoddyKit. Dies ist Lektion 1 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Angular Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Angular Academy-Kurs umfasst insgesamt 4 Lektionen.
Was sind Signals?
Ein Signal ist ein reaktives Grundelement, das in modernen Angular-Versionen eingeführt wurde. Es ist ein Wrapper um einen Wert, der interessierte Konsumenten benachrichtigen kann, wenn sich dieser Wert ändert.
Signals machen die Reaktivität von Angular explizit, granular und leicht nachvollziehbar.
Warum Reaktivität wichtig ist
In einem UI-Framework muss der Bildschirm mit Ihren Daten synchron bleiben. Wenn sich Daten ändern, sollte die Ansicht aktualisiert werden.
Signals geben Angular eine präzise Möglichkeit zu erkennen, was sich genau geändert hat und was davon abhängt, sodass nur die betroffenen Teile der Ansicht aktualisiert werden.
Das Problem vor Signals
Früher stützte sich Angular auf Zone.js und eine umfassende Änderungserkennung: Nach jedem asynchronen Ereignis überprüfte Angular große Teile des Komponentenbaums erneut.
Das funktioniert, kann aber ineffizient sein. Signals ermöglichen feingranulare Aktualisierungen, ohne alles zu durchsuchen.
Ein Signal enthält einen Wert
Stellen Sie sich ein Signal als eine intelligente Box um einen Wert vor. Sie können den enthaltenen Wert lesen und ersetzen.
Beim Lesen eines Signals wird außerdem erfasst, wer es liest, damit abhängige Elemente später aktualisiert werden können.
import { signal } from '@angular/core';
const count = signal(0);
// count is now a signal holding the number 0Lesen ist ein Funktionsaufruf
Eine zentrale Idee: Um ein Signal zu lesen, rufen Sie es wie eine Funktion auf. An den Klammern erkennt Angular, dass Sie den aktuellen Wert lesen.
const count = signal(0);
console.log(count()); // 0 <-- note the ()Signals sind synchron
Das Lesen eines Signals erfolgt synchron und gibt immer sofort den aktuellen Wert zurück. Es gibt kein Abonnement, keinen Async-Pipe und kein manuelles Aufheben von Abonnements.
Beschreibbar vs. berechnet
Das mit signal() erstellte grundlegende Signal ist beschreibbar: Sie können seinen Wert ändern.
Außerdem gibt es computed-Signals (abgeleitete Werte) und effects (Seiteneffekte), die auf beschreibbaren Signals aufbauen.
Signals verfolgen Abhängigkeiten
Wenn ein berechneter Wert oder ein Template ein Signal liest, erfasst Angular diese Abhängigkeit automatisch.
Wenn sich das Signal später ändert, werden nur die davon abhängigen Elemente neu berechnet. Das macht Signals effizient.
Aktualisierungen ohne Zwischenzustände
Signals sind so konzipiert, dass keine inkonsistenten Zwischenzustände entstehen: Konsumenten sehen immer einen konsistenten Wert und werden nicht mit einem teilweise aktualisierten Zwischenstand benachrichtigt.
Dadurch werden komplexe reaktive Graphen vorhersehbar.
Wo Signals definiert sind
Signals sind Bestandteil von @angular/core. Sie importieren signal, computed und effect von dort.
Sie können innerhalb von Komponenten, Services oder beliebigem TypeScript-Code verwendet werden.
import { signal, computed, effect } from '@angular/core';Signals in einer Komponente
Ein häufig verwendetes Muster besteht darin, Signals als Klassenfelder in einer Komponente zu deklarieren und sie anschließend im Template zu lesen.
import { Component, signal } from '@angular/core';
@Component({ selector: 'app-counter', template: '' })
export class CounterComponent {
count = signal(0);
}Kurze Überprüfung: Signal-Grundlagen
Überprüfen wir Ihr Verständnis davon, was ein Signal ist.
Rückblick: Was sind Signals?
Sie haben gelernt, dass ein Signal ein reaktiver Wrapper um einen Wert ist, der Konsumenten bei Änderungen benachrichtigt. Sie lesen ein Signal, indem Sie es mit Klammern aufrufen. Das Lesen erfolgt synchron, und Signals ermöglichen feingranulare Aktualisierungen ohne inkonsistente Zwischenzustände.
Als Nächstes erstellen und lesen Sie eigene Signals.
Häufig gestellte Fragen
Ist die Lektion „Was sind Signals“ kostenlos?
Ja — der vollständige Text von „Was sind Signals“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Angular Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Angular Academy-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „Was sind Signals“?
Verstehen Sie Signals als reaktive Container für Zustände. Du übst Angular Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um Angular Academy zu starten?
Keine Vorkenntnisse erforderlich. Angular Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 1 von 4.
Wie lange dauert die Lektion „Was sind Signals“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser Angular Academy-Lektion Code schreiben und ausführen?
Ja. Jede Angular Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- Was sind Signals
- Signals erstellen und lesen
- Signals mit set und update aktualisieren
- Signals in Templates