IfProcessor

Überblick

Der IfProcessor ermöglicht die bedingte Darstellung von Elementen in Templates basierend auf Werten aus dem RenderContext.

Funktionsweise

Findet Elemente mit einem if-Attribut
Prüft den Wert der angegebenen Bedingung im RenderContext
Entfernt das Element, wenn die Bedingung nicht erfüllt ist ("falsy")
Entfernt nur das if-Attribut, wenn die Bedingung erfüllt ist ("truthy")

Syntax

<div if="bedingung">...</div>

Beispiel

<div if="isLoggedIn" class="user-panel">
    Benutzerbereich
</div>

<button if="!isLoggedIn" class="login-button">Anmelden</button>

Implementierung

Der Prozessor verwendet querySelectorAll('*[if]'), um alle Elemente mit einem if-Attribut zu finden. Der Wert des Attributs wird als Schlüssel im RenderContext verwendet. Die Methode isTruthy() bestimmt, ob der Wert als wahr angesehen wird.

Wahrheitswerte (Truthy/Falsy)

Die folgende Logik wird verwendet, um zu bestimmen, ob ein Wert "truthy" ist:

Boolean true: Truthy
Boolean false: Falsy
null: Falsy
Leerer String oder nur Leerzeichen: Falsy
Numerischer Wert 0: Falsy
Leeres Array: Falsy
Alle anderen Werte: Truthy

Tipps

Das if-Attribut kann an jedem beliebigen HTML-Element verwendet werden
Bei Erfüllung der Bedingung bleibt das Element erhalten, nur das if-Attribut wird entfernt
Für komplexere Bedingungen können vordefinierte Variablen im RenderContext verwendet werden

1.5 KiB Raw Blame History