0Pricing
Angular Academy · Lektion

Signals erstellen und lesen

Deklarieren Sie beschreibbare Signals und lesen Sie ihre Werte.

Signals erstellen und lesen ist eine kostenlose Angular Academy-Lektion auf CoddyKit. Dies ist Lektion 2 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.

Ein Signal erstellen

Sie erstellen ein beschreibbares Signal mit der Factory signal() und übergeben dabei den Ausgangswert.

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

const c = signal(0); // initial value is 0

Der Ausgangswert legt den Typ fest

TypeScript leitet den Signaltyp aus dem Ausgangswert ab. signal(0) ist ein WritableSignal<number>.

const name = signal('Alice'); // WritableSignal<string>
const flag = signal(false);    // WritableSignal<boolean>

Ein Signal lesen

Rufen Sie das Signal auf, um seinen aktuellen Wert zu lesen. Dadurch wird der gespeicherte Wert zurückgegeben und eine Abhängigkeit registriert, wenn Sie sich in einem reaktiven Kontext befinden.

const c = signal(0);
const current = c(); // current === 0

Mehrfaches Lesen

Sie können ein Signal beliebig oft lesen. Jeder Aufruf gibt den zum Zeitpunkt des Aufrufs aktuellen Wert zurück.

const c = signal(10);
console.log(c()); // 10
console.log(c()); // 10

Explizite Typangabe

Sie können einen expliziten Typ angeben, wenn der Ausgangswert den Typ nicht vollständig abbildet, beispielsweise bei einem Wert, der auch null sein kann.

const user = signal<string | null>(null);
console.log(user()); // null

Objekt-Signals

Ein Signal kann jeden Wert enthalten, auch Objekte und Arrays.

const point = signal({ x: 0, y: 0 });
console.log(point().x); // 0

Array-Signals

Arrays funktionieren auf dieselbe Weise. Beim Lesen wird die aktuelle Array-Referenz zurückgegeben.

const items = signal<string[]>(['a', 'b']);
console.log(items().length); // 2

Signals als Klassenfelder

Deklarieren Sie Signals in Komponenten und Services als Felder. Sie werden einmalig erstellt, wenn die Instanz erzeugt wird.

import { Injectable, signal } from '@angular/core';

@Injectable({ providedIn: 'root' })
export class CounterStore {
  count = signal(0);
}

Lesen in der Komponentenklasse

Sie können ein Signal überall in der Klasse lesen, beispielsweise innerhalb einer Methode, indem Sie es aufrufen.

export class CounterStore {
  count = signal(0);
  isZero(): boolean {
    return this.count() === 0;
  }
}

Schreibgeschützter Zugriff

Wenn Sie ein Signal verfügbar machen möchten, ohne Konsumenten eine Änderung zu erlauben, können Sie es über die Methode asReadonly() bereitstellen.

const internal = signal(0);
export const value = internal.asReadonly();
// value() works; value.set is not available

Namenskonventionen

Eine gängige Konvention besteht darin, das Signal nach dem darin enthaltenen Wert zu benennen (zum Beispiel count, items), da das Lesen wie ein normaler Zugriff aussieht: count().

Kurze Überprüfung: Signals erstellen

Testen Sie Ihr Verständnis vom Erstellen und Lesen von Signals.

Rückblick: Erstellen und Lesen

Sie wissen nun, wie Sie mit signal(initialValue) ein beschreibbares Signal erstellen, wie TypeScript dessen Typ ableitet und wie Sie es durch Aufrufen lesen. Außerdem haben Sie asReadonly() kennengelernt, um schreibgeschützten Zugriff bereitzustellen. Als Nächstes geht es um das Aktualisieren von Signalwerten.

Häufig gestellte Fragen

Ist die Lektion „Signals erstellen und lesen“ kostenlos?

Ja — der vollständige Text von „Signals erstellen und lesen“ 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 „Signals erstellen und lesen“?

Deklarieren Sie beschreibbare Signals und lesen Sie ihre Werte. 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 2 von 4.

Wie lange dauert die Lektion „Signals erstellen und lesen“?

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

  1. Was sind Signals
  2. Signals erstellen und lesen
  3. Signals mit set und update aktualisieren
  4. Signals in Templates
← Zurück zu Angular Academy