Model Explorer

Der Tab im Überblick

Den Tab Models gibt es nur im DevTools-Panel: F12 → Panel FrontTailor → Models. Ohne gewähltes Control zeigt er die Models der Root-Komponenten der App; mit einem Control dessen eigene und geerbte Models.

1. Control-ID eingeben und Anzeigen wählt ein Control ohne Inspector. App-Models hebt die Auswahl wieder auf, das Symbol rechts aktualisiert die Liste.
2. Die Liste der Models: Name (das unbenannte heißt (Default-Model)), Typ und ob das Model eigenes oder geerbt ist.
3. Snapshot nehmen und Vergleichen, siehe Snapshot und Diff.
4. Keys und Werte durchsuchen: Treffer bleiben mit ihren Vorfahren stehen. Daneben Alle aufklappen und Alle zuklappen.
5. JSON kopieren nimmt den gezeigten Teilbaum mit, Pfad kopieren den Pfad des gewählten Knotens, etwa view>/editable.
6. Der Baum mit den Daten. Darüber steht, wie viele Werte gelesen wurden und wann.

Über das Feld Pfad und Laden holst du einen Teilbaum gezielt. Das braucht es bei großen Models: Der Baum liest bis zu 12 Ebenen tief, 20.000 Werte und 2.000 Zeichen je Text; darüber steht „Großes Model: Die Daten wurden gekürzt …“.

OData-Models: was schon geladen ist

1. Das (Default-Model) vom Typ OData V2, rechts mit Klasse und Service-URL.
2. Gecachte Entitäten: „Nur aus dem Model-Cache gelesen; FrontTailor sendet keinen Request.“
3. Ein Entity-Set mit der Zahl der Entitäten im Cache. Ein Klick filtert den Baum darauf.

Fehlt eine Entität, hat die App sie (noch) nicht geladen. Was das Backend tatsächlich gesendet hat, zeigt die OData-Konsole.

Snapshot und Diff: was eine Aktion ändert

1. Im Tab Models das Model wählen, etwa view.
2. Snapshot nehmen klicken. Es erscheint „Snapshot von … Jetzt in der App etwas tun, dann vergleichen.“
3. In der App die Aktion ausführen – im Beispiel Bearbeiten in der Demo-App.
4. Vergleichen klicken. Änderungen seit dem Snapshot listet jeden Pfad als hinzugefügt, entfernt oder geändert, mit altem und neuem Wert.
5. Mit Snapshot verwerfen fängst du von vorne an.

1. Vergleichen liest das Model neu und vergleicht mit dem Snapshot.
2. Eine Änderung: Art, Pfad, alter Wert, neuer Wert.

Angezeigt werden die ersten 1.000 Änderungen; bei mehr steht ein Hinweis darunter.

i18n: Key, Bundle und Texte je Sprache

Ist ein Control gewählt (im Inspector oder über die Control-ID), zeigt der Abschnitt i18n jede Property, die an ein ResourceModel gebunden ist.

1. Key mit Model-Name, z. B. i18n>edit.
2. Bundle: Name und Datei des Resource-Bundles.
3. Texte je geladener Sprache, darunter „(Noch) nicht geladen: …“ für Fallback-Sprachen, die UI5 noch nicht geholt hat. FrontTailor lädt keine Sprache nach.
4. Fehlende Keys suchen prüft alle Controls der Seite und listet Texte, die als Key angezeigt werden (bis 200 Einträge). Control anzeigen springt zum Fund.

Neben dem Key steht Key vorhanden, Key fehlt oder Ohne Nachladen einer Sprache nicht feststellbar.

Gebundene Controls

Zu einem Knoten im Baum sucht Gebundene Controls suchen die Controls, deren Bindings diesen Knoten oder einen Knoten darunter nutzen – in einem Durchlauf über die Controls der Seite. Ein Klick auf einen Treffer wählt das Control im Inspector. Umgekehrt öffnet Im Model Explorer anzeigen im Inspector diesen Tab genau am gebundenen Pfad.

Alle Knöpfe und Felder

Typische Probleme