Daten binden an UI BuilderSeiten mit Controllern (erweiterte Funktion)

Controller vereinfachen die Verknüpfung von Daten und Ereignislogik, um Komponentenvoreinstellungen in zu aktivieren UI Builder.

Mit Controllern können Seitengeneratoren Daten und Skripts einfach mit ihren Seiten in verbinden UI Builder. Ein Controller ist eine Art von Datenressource, die KomponentenvoreinstellungenWird verwendet, um Daten an Komponenten zu binden. Controller unterscheiden sich von anderen Datenressourcen dadurch, dass sie Daten- und Ereignislogik enthalten, die Voreinstellungen für Komponenten ermöglicht. Ein Controller ruft Daten vom Server in eine Komponente zurück, und er bringt aktualisierte Daten basierend auf Interaktionen mit der Komponente an den Server zurück. Weitere Informationen zu Komponentenvoreinstellungen finden Sie unter Komponenten mithilfe von Voreinstellungen automatisch konfigurieren.

Controller werden standardmäßig hinzugefügt, wenn Sie einen verwenden UI BuilderSeitenvorlage. Sie können Controller zu hinzufügen UI BuilderSeiten ohne Controller im Datenressourcen-Drawer oder durch Auswahl einer Komponentenvoreinstellung nach dem Hinzufügen einer Komponente zu einer Seite. Sie können anzeigen, welche Controller auf Ihrer Seite konfiguriert sind, indem Sie die Drawer „Datenressourcen“ öffnen.

Abbildung : 1. Controller in der Datenressourcenschublade

Typen von Datencontrollern in UI Builder

Datencontroller

Die Datenverantwortlichen entscheiden, auf welchen Informationen angezeigt werden sollen UI BuilderSeiten. Datencontroller verwenden Datenressourcen, um Informationen in Echtzeit zu synchronisieren und Daten/Tabellen zu aktualisieren, wenn ein Anwender Informationen eingibt. Sie können einer Seite manuell Daten-Controller hinzufügen.

UI-Controller

UI-Controller werden bei Verwendung von zu Seiten hinzugefügt UI BuilderSeitenvorlagen und können nicht manuell hinzugefügt werden.

Verwenden von Controllern mit Voreinstellungen in UI Builder

Sie können mehreren Controllern zu hinzufügen UI BuilderSeite, aber Sie können dieselbe nicht zweimal verwenden. Wenn Sie versuchen, eine Komponentenvoreinstellung zu verwenden, die einen Controller benötigt, UI BuilderFordert Sie auf, es hinzuzufügen.

Nicht alle Komponenten funktionieren mit Controllern, aber Sie können in der Komponentenbibliothek leicht sehen, welche Komponenten funktionieren. Wenn Sie einen Controller auf konfiguriert haben UI BuilderSeite können Sie die Komponentenbibliothek öffnen, um anzuzeigen, welche Komponenten Voreinstellungen haben. Komponenten mit verfügbaren Voreinstellungen werden in der Komponentenbibliothek hervorgehoben.

Abbildung : 2. Komponenten mit Voreinstellungen

Fügen Sie einen Controller hinzu

Fügen Sie Ihrer Seite einen Daten-Controller hinzu, um Komponentenvoreinstellungen zu verwenden.

Vorbereitungen

Erforderliche Rolle: Administrator

Warum und wann dieser Vorgang ausgeführt wird

Der Datensatz-Controller ist der einzige Controller, den Sie einer Seite in hinzufügen können Zurich.

Prozedur

1. Navigieren zu Alle > Now-Experience-Framework > UI Builder.
2. Öffnen Sie eine Experience, in der Sie arbeiten können, oder erstellen Sie eine Experience, indem Sie auswählen Erstellen > Experience.
   Weitere Informationen finden Sie unter Konfigurieren Sie, wie Anwender mit Ihren Anwendungen in interagieren UI Builder.
3. Erstellen oder öffnen Sie eine Seite oder Seitenvariante.
   Um weitere Informationen zum Erstellen einer Seite in zu erhalten UI Builder, Siehe Erstellen Sie eine Seite in UI Builder .
4. Wählen Sie aus + Symbol im Datenressourcendrawer.
5. Wählen Sie Aus Datenressource .
   
6. Eingabetaste Formular Im Suchfeld.
7. Wählen Sie den Controller aus, den Sie Ihrer Seite hinzufügen möchten.
8. Wählen Sie Hinzufügen.
   
9. Füllen Sie die Felder aus, um den Controller zu konfigurieren.
   

Ergebnisse

Der Formular-Controller wird in angezeigt Datenressourcen Abschnitt.

Bearbeiten Sie einen Controller

Konfigurieren Sie einen Controller, um Daten aus einer Tabelle abzurufen.

Vorbereitungen

Erforderliche Rolle: Administrator

Prozedur

1. Navigieren zu Alle > Now-Experience-Framework > UI Builder.
2. Öffnen Sie eine Experience, in der Sie arbeiten können, oder erstellen Sie eine Experience, indem Sie auswählen Erstellen > Experience.
   Weitere Informationen finden Sie unter Konfigurieren Sie, wie Anwender mit Ihren Anwendungen in interagieren UI Builder.
3. Erstellen oder öffnen Sie eine Seite.
   Um weitere Informationen zum Erstellen einer Seite in zu erhalten UI Builder, Siehe Erstellen Sie eine Seite in UI Builder .
4. Wählen Sie den Controller aus, den Sie in bearbeiten möchten Daten und Skripts Drawer.
   
5. Füllen Sie im Formular die Felder aus.

   Tabelle : 1. Formular-Controller

   Feld	Beschreibung
   Typ	Controller ist als Typ für alle Controller vordefiniert.
   Tabelle	Fügen Sie eine Tabelle hinzu, aus der der Controller Daten abrufen soll.
   Sys-ID	Geben Sie den eindeutigen Bezeichner für einen Datensatz ein, geben Sie einen Wert an, oder verwenden Sie -1, um einen neuen Wert zu generieren.

6. Schließen Sie das modale Element „Controller bearbeiten“.
7. Wählen Sie Speichern.

Löschen Sie einen Controller

Löschen Sie einen Controller, den Sie in nicht mehr benötigen UI Builder.

Vorbereitungen

Erforderliche Rolle: Administrator

Warum und wann dieser Vorgang ausgeführt wird

Controller können nicht aus Seiten gelöscht werden, die mit einer Seitenvorlage erstellt wurden.

Prozedur

1. Navigieren zu Alle > Now-Experience-Framework > UI Builder.
2. Öffnen Sie eine Experience, in der Sie arbeiten können, oder erstellen Sie eine Experience, indem Sie auswählen Erstellen > Experience.
   Weitere Informationen finden Sie unter Konfigurieren Sie, wie Anwender mit Ihren Anwendungen in interagieren UI Builder.
3. Öffnen Sie die Seite mit dem Controller, den Sie löschen möchten.
4. Wählen Sie aus Menü Symbol ( ) Neben dem Controller, den Sie löschen möchten.
   
5. Wählen Sie Löschen.
   
   Der Controller wird aus den lokalen Datenressourceninstanzen entfernt.

Zeigen Sie Eigenschaften und Ereignisse in der Controller-API an

Die öffentliche Controller-API definiert die Ausgabedaten, die ein Controller für eine Voreinstellung bereitstellt. Dies umfasst die Eigenschaftswerte und behandelten Ereignisse, die von einer Komponente verwendet werden, wenn eine Voreinstellung ausgewählt wird. Eigenschaften- und Ereignisinformationen können in UI Builder angezeigt werden.

Die Komponenteneigenschaftswerte in einer Voreinstellung können statische Werte oder Pfade zu Controller-Ausgabedaten sein. Sie können den Datenressourcen-Inspektor in UI Builder verwenden, um die Werte aus der Controller-Datenstruktur anzuzeigen, die von einer Voreinstellung verwendet wird. Um die Nutzlast eines Ereignisses in der Voreinstellung anzuzeigen, können Sie in der Ereignishandlerauswahl nach diesem Ereignis suchen.

Zeigt Eigenschaften in der Controller-API an

Sie können voreingestellte Eigenschaften im UIB-Dateninspektor anzeigen. Das Wissen um die verfügbaren Werte hilft Ihnen, zu verstehen, wie sich eine Komponente in Ihrem Design verhält, und hilft Ihnen, alle Eigenschaften in der Voreinstellung zu identifizieren, die Sie möglicherweise überschreiben möchten.

Bei diesem Verfahren wird davon ausgegangen, dass Sie eine Komponente mit einer Voreinstellung auf der Seite platziert und einen Controller konfiguriert haben. Anweisungen finden Sie unter Fügen Sie einen Controller hinzu .

Auf der Registerkarte „Konfiguration“ werden voreingestellte Eigenschaftswerte als Pfad zur Controller-Ausgabe angezeigt. Der Basisdatenpfad wird als ausgedrückt @Data.<controller_name> . Der Rest des Pfads wird anhand des Inhalts der Kategorien in der Controller-Datenhierarchie erstellt. Sie können diesen Pfad verwenden, um die aktuellen Werte für den Datensatz anzuzeigen, für den der Controller konfiguriert wurde.

1. Um die Datenressourcen für eine Komponente anzuzeigen, wählen Sie das Datensymbol in der unteren linken Sidebar aus.

   

   Der dreispaltige UIB-Dateninspektor wird angezeigt.

2. Wählen Sie in der ersten Spalte, in der die Datenressourcen aufgeführt sind, den Controller aus, dessen Ausgabe Sie anzeigen möchten.
   Die Konfigurationsdaten für den ausgewählten Controller werden auf der Registerkarte „Konfiguration“ der zweiten Spalte angezeigt. Dies sind die Eingabeeigenschaften, die Sie eingegeben haben, als Sie den Controller für die erste Komponente mit einer Voreinstellung konfiguriert haben, die Sie auf der Seite platziert haben. Sie können diese Verbindungswerte hier bearbeiten, wenn Sie möchten.

   Hinweis:

   Wird Konfiguriert -1 Für den Wert in SYS-ID Das Feld konfiguriert den Controller für einen neuen Datensatz. Der Controller generiert dann eine vollständige GUID, mit der Sie Daten für den Datensatz speichern können, bevor er gespeichert wird. Dadurch können Sie Aktionen in einem neu erstellten Datensatz ausführen, z. B. Anhänge speichern.
   
   
   
3. Wählen Sie Aus Ausgaben der obersten Ebene In der dritten Spalte.

   Dies ist die übergeordnete Ebene der Controller-Datenhierarchie, die mit dem Präfix angegeben wird @Data. , Gefolgt von der Controller-ID. Diese Kombination bildet den Stammpfad zu den Daten. Die Daten, die in den Ausgaben der obersten Ebene enthalten sind, werden im angrenzenden Codefeld angezeigt und stehen für die Verwendung von Voreinstellungen und Skripts zur Verfügung. Andere Eigenschaften auf dieser Ebene sind einige allgemeine Eigenschaften, die für alle Datensätze gelten.

   

   Wenn die Voreinstellung eine Komponenteneigenschaft der Controller-Ausgabe zuordnet, wird der Pfad zur Ausgabe anstelle des Werts angezeigt. Pfade sind als gekennzeichnet @Data.< Controller-ID >.< Pfad von der obersten Ebene zur Ausgabeeigenschaft > Und können als Werte oder als Teil von Formelausdrücken verwendet werden.

   In diesem Beispiel ergibt die Zuordnung in der Voreinstellung einen Pfad zu @Data.gform.table .

   
   
   
4. Um Daten unterhalb der obersten Ebene anzuzeigen, wählen Sie die untergeordnete Kategorie aus, die durch den Pfad im voreingestellten Eigenschaftswert angegeben wird.

   Der Name der untergeordneten Kategorie wird im Pfad als angezeigt @Data.<controller ID>.<category> . Die Daten aus dieser Kategorie werden dann an diesen Pfad angehängt. Der Stammpfad über dem Codefeld gibt die verwendete untergeordnete Kategorie an. In diesem Beispiel der Pfad zu Ansicht Eigenschaft in Formular Kategorie wird ausgedrückt als @Data.gform.Form.View . Dieser voreingestellte Wert zeigt Formulare in an Arbeitsbereich Ansicht.

   
   
   

   In diesem Beispiel werden mehrere Controller-Ausgabeeigenschaften in einem Formelausdruck zum Erstellen eines Objekts verwendet.

   
   
   
5. Um einen geskripteten Eigenschaftswert anzuzeigen, wählen Sie das Schlosssymbol neben der Eigenschaft aus.

   Dadurch wird die Eigenschaft in den Bearbeitungsmodus versetzt und ein Modal zum Bearbeiten des Skripts geöffnet.

   

Anzeigen von Ereignissen im Controller API

Sie können behandelte Ereignisse, die einer Komponente durch eine Voreinstellung zugeordnet sind, und ihre Nutzlasten auf der Registerkarte „Ereignisse“ im UI Builder-Konfigurationsbereich anzeigen. Wenn die Datenzuordnung für ein Ereignis für Ihren Anwendungsfall nicht geeignet ist, können Sie zusätzliche Daten-Handler hinzufügen.

Hinweis:

Mit der Voreinstellung bereitgestellte Daten-Handler-Zuordnungen können nicht bearbeitet werden.

1. Wählen Sie die Registerkarte Ereignisse im UI Builder aus.
2. Um die Zuordnung für ein voreingestelltes Ereignis anzuzeigen, wählen Sie die Ereigniskachel aus.

   Ein Modal mit den Nutzlasteigenschaften für das voreingestellte Ereignis wird angezeigt. Sie können Deaktivieren Das Ereignis in diesem Modal.

   
   
   
3. Wählen Sie aus, um dem Ereignis einen Ereignis-Handler hinzuzufügen + Ereignishandler hinzufügen Unter der Ereigniskachel.
   
   
   

   Ein Modal wird angezeigt, das eine Liste der verfügbaren, behandelten Ereignisse anzeigt. Sie können eine beliebige Aktion aus der Liste auswählen, einschließlich eines Ereignis-Handlers aus einem der aufgeführten Controller.

4. Wählen Sie einen Ereignis-Handler aus der Liste aus, und wählen Sie aus Hinzufügen .

   Der neue Handler wird unter der Ereigniskachel aufgeführt.