Daten auf UI Builder-Seiten dynamisch verfügbar machen (erweiterte Funktion)

Synchronisieren Sie Daten zwischen ServiceNow Tabellen und Daten mit den Seiten, die Sie mit UI Buildererstellen. Seiten zeigen synchronisierte Daten in Echtzeit an und aktualisieren Daten/Tabellen, wenn ein Benutzer Informationen eingibt.

Erfahren Sie mehr über Datenressourcen in UI Builder

UI Builder synchronisiert ServiceNow Tabellen/Daten mit Datenressourcen. Eine Datenressource ruft die Daten ab, die UI Builder zum Anzeigen von Informationen in einer Komponente verwendet. UI Builder -Komponenten verwenden Datenressourcen, um Daten über verschiedene Experiences hinweg zu synchronisieren. Datenressourcen machen die Daten in Komponenten dynamisch, sodass Sie die Daten nicht für jede Seite neu erstellen müssen.

Datenressourcen befinden sich im Datenressourcen-Drawer. Im Datenressourcen-Drawer können Sie eine Datenressource für Ihre Seite hinzufügen und konfigurieren. Nachdem Sie die Datenressource konfiguriert haben, können Sie die Daten zwischen Komponenten auf Ihrer Seite und ServiceNow Tabellen/Datensynchronisieren.

Abbildung : 1. Datenressource Drawer

Der Datenressourcen-Drawer enthält drei Abschnitte:

• Datenressourcen: Die Datenressourcen, die Teil der Experience sind
• Konfiguration/Ereignisse: Konfigurierte Datenressourcen und Ereignisse für die Experience
• Vorschau: JSON für die von der Datenressource zurückgegebenen Informationen

Sie können die Konfigurationseigenschaften für Komponenten, andere Datenressourcen, Clientskripts, Clientstatus und Events an diese Datenressourcen binden.

Legen Sie Bedingungen für einen Filter in Ihrer Datenressource fest. Weitere Informationen finden Sie unter Verbinden Sie Daten mit Ihren Komponenten.

Funktionsweise von Datenressourcen in UI Builder

Datenressourcen rufen Daten aus Glide-, GraphQL- und REST-APIs ab und wandeln sie dann zur Verwendung in einer Komponente auf einer Seite UI Builder um.

Komponenten verwenden sowohl geerbte als auch lokale Datenressourceninstanzen. Geerbte Datenressourcen werden automatisch in eine Seite UI Builder geladen, und lokale Datenressourceninstanzen können hinzugefügt und konfiguriert werden. Datenressourcen werden basierend auf den angegebenen Eingabewerten ausgewertet, um sicherzustellen, dass die richtigen Daten abgerufen werden. Weitere Informationen zu geerbten und lokalen Datenressourcen finden Sie unter Geerbte im Vergleich zu lokalen Datenressourcen in UI Builder.

Abbildung : 2. Beispiel für Datenressource

Lokale Datenressourcen in UI Builder

Sie können lokale Datenressourcen wie Serverdaten, Vorgänge, Transformationen oder Client-Daten wie die gForm-API auswählen, um Daten auf die Seite UI Builder zu übertragen.

Hinweis:

In UI Builderwird pro Seite nur eine GlideForm unterstützt. Weitere Informationen zu GlideForm finden Sie auf der ServiceNow Developer Site.

Datenressourcen werden im Datenressourcen-Drawer nach Anwendung organisiert. Sie werden dann nach dem Datenressourcentyp wie Serverdaten oder Transformation weiter kategorisiert. Beispielsweise verfügt die Anwendung Global über mehrere Datenressourcen, die Anwendung Kundenservice-Management (Customer Service Management, CSM) Workspace jedoch nur über wenige Datenressourcen.

Abbildung : 3. Datenressourcen

Abhängig von der Anwendung, in der Sie sich befinden, werden unterschiedliche Datenressourcen angezeigt. Wenn Sie die Anwendung Global auswählen, werden unter Serverdaten andere Datenressourcen angezeigt als bei Auswahl der Anwendung CSM Configurable Workspace.

Verwenden der Datenbindung in UI Builder

Mit der Datenbindung können Sie dynamische Seiten erstellen, indem Sie Seiten und Komponenten mit Datenressourcen synchronisieren. Sie können Daten an eine Komponente binden, um Daten vom Back-End abzurufen, und Feldparameter verwenden, um Eigenschaften von der URL abzurufen. Durch das Ändern der URL-Parameter können Sie dynamische Seiten erstellen, die je nach Parameter unterschiedliche Daten anzeigen.

Sie können Daten auf folgende Weise an eine Komponente binden:

Kontextbindung

Verwenden Sie URL-Parameter, um Teile der URL mit den Eigenschaften Ihrer Seite zu verknüpfen. Sie können beispielsweise den Tabellennamen aus der URL mit Ihrer Komponente verknüpfen, indem Sie die @context-Syntax verwenden, z. B.: @context.props.table.

Stellen Sie sich vor, Sie haben eine Seite UI Builder mit einem Pflichtfeld namens table. Die URL für Ihre Seite könnte wie folgt aussehen: /demo/page/<table-name> . Die<table-name> könnte so etwas wie Incidentsein. Die Daten können auch aus übergeordneten Datenressourcen stammen oder lokale Eigenschaften sein, die für die Seite spezifisch sind.

Um Ihre Komponenteneigenschaften, andere Datenressourceneigenschaften oder Event-Details mit der Seiteneigenschaft zu verknüpfen, verwenden Sie eine @context.props.table- Bindung. Stellen Sie sicher, dass Sie entweder einen Testwert in der URL angeben oder einen festen Wert für diese Eigenschaft in der Konfiguration Ihrer Seite festlegen, wenn Sie die Kontextbindung verwenden.

Datenressourcenbindung

Verwenden Sie Datenressourcen, um Daten vom Back-End Ihrer Instanz abzurufen, z. B. Clientstatus, GraphQL oder eine REST-API. Diese Datenquellen haben Eigenschaften, die mit Elementen auf einer Seite UI Builder verknüpft werden können.

Wenn Sie beispielsweise die Datenressource Suchdatensatz verwenden, können Sie sie in einer Schaltflächenkomponente verwenden. Sie können einen Datenausdruck in der Eigenschaft „label“ wie diesen verwenden: @data.lookup_record_1.result.number.displayValue.

Komponentenbindung

Verwenden Sie die Komponentenbindung, um eine Komponente mit einer anderen zu verbinden. Angenommen, Sie haben eine Listenmenükomponente auf der Seite UI Builder. Das Listenmenü zeigt die aktuell ausgewählte Liste anderen Komponenten auf derselben Seite an. Diese anderen Komponenten können auf die Daten zugreifen, indem sie mit einem Ausdruck wie @elements.list_menu_1.selectedListIdeine Verknüpfung herstellen.

Clientstatus-Parameterbindung

Verwenden Sie die Clientstatus-Parameterbindung, um Daten zwischen einer clientseitigen Anwendung und UI Builder -Komponenten zu verbinden und zu synchronisieren. Die Parameterbindung ermöglicht es dem Clientstatus, Daten in Komponenten automatisch zu aktualisieren und umgekehrt. Verwenden Sie die @state-Syntax, um eine Statuseigenschaft an einen Client-Statusparameter zu binden.

Typen der in verfügbaren Datenquellen UI Builder

Sie können die folgenden Datenressourcentypen verwenden, die in der Tabelle angezeigt werden.

Tabelle : 1. Datenressourcentypen

Datenressourcentyp	Beschreibung
Controller	Kapselt Daten und Event-Logik und ermöglicht Voreinstellungen für Komponenten.
GraphQL	GraphQL-Abfragen und -Mutationen, die ausgeführt werden.
Umwandeln	Skript, das die Eingabedaten in ein anderes Format umwandelt.
Client-Status	Clientseitige Datenressourcen, die Client-Informationen, domänenspezifische Status oder Logik, Benutzereinstellungen usw. enthalten.
Zusammenfassung	Einzelne wiederverwendbare Datenressource, die mehrere Datenressourcen enthält.
REST	Datenressourcen, die über REST-API-Anforderungen gestellt werden.

Geerbte im Vergleich zu lokalen Datenressourcen in UI Builder

Geerbte Datenressourcen geben Informationen aus den umgebenden Teilen einer UI Builder -Seite frei, z. B. aus einer -Anwendung. Stellen Sie sich vor, Ihre Seite befindet sich in einem großen Frame und erhält einige Informationen aus dem Frame oder anderen Teilen um ihn herum. Sie können diese Informationen verwenden, indem Sie sie mit den Eigenschaften Ihrer Seite verknüpfen, ähnlich wie beim Verknüpfen von Teilen. Wenn Sie diese Informationen aus dem Frame abrufen, müssen Sie sie nicht erneut selbst abrufen.

Lokale Datenressourcen sind Elemente, die Sie selbst zu einer UI Builder -Seite hinzufügen. Stellen Sie sich vor, Sie erstellen eine Seite für Reiseanforderungen. Sie können Mitarbeiterdaten mit einer Listenkomponente synchronisieren, damit Mitarbeiter Reisen anfordern können, die mit ihren eigenen Informationen verknüpft sind.

Um diese Datenressourcen zu verwenden, rufen Sie sie entweder aus einer -App ab, oder erstellen Sie sie in der ServiceNow -Plattform. Machen Sie diese Ressourcen dann in UI Builderfür Ihre -Komponenten verfügbar. Binden Sie als Nächstes die Daten an Ihre Komponente, damit sie damit arbeiten kann. Beispielsweise können Sie eine Reihe von Datensätzen in UI Builder verfügbar machen und mit einer Komponente verknüpfen. Konfigurieren Sie von dort aus die Komponente, um Dinge mit den Daten zu tun, z. B. neue Datensätze zu speichern.

Sobald Ihre Seite Daten synchronisiert, verbinden Sie sie mit dem Teil der Seite, der sie benötigt, z. B. mit einer -Komponente. Es ist so, als ob man sicherstellen würde, dass das richtige Teil eines Puzzels an die richtige Stelle passt. Dann können Sie diesem Teil der Seite mitteilen, was mit den Daten geschehen soll. Beispielsweise können Sie damit neue Reisepläne für Mitarbeiter hinzufügen.

UI Builder Eigenschaften der Datenressource

Wenn Sie eine Datenressource in UI Builderhinzufügen, ist dies wie das Hinzufügen eines Tools, das weiß, woher Informationen abgerufen werden sollen. Datenressourceneigenschaften sind die Anweisungen, die einer Datenressource mitteilen, wie Daten in UI Builder -Seiten eingefügt werden sollen. Diese Eigenschaften teilen einer Datenressource mit, welche Daten abgerufen, wie sie organisiert werden sollen und welche Bedingungen zu befolgen sind. Beispielsweise können Sie diese Eigenschaften verwenden, um anzugeben, in welchen Tabellen gesucht werden soll, wie die Daten sortiert werden sollen usw. Diese Eigenschaften sorgen dafür, dass die Datenressource ordnungsgemäß funktioniert, und geben Ihnen die Daten, die Sie benötigen.

UI Builder Datenressourcenskripts

Datenressourcenskripts sind spezielle Anweisungen, die Sie UI Builder erteilen, um bestimmte Datenelemente zurückzugeben. Wenn Sie beispielsweise eine Liste von Produkten bearbeiten, kann ein Skript eine Datenressource anweisen, nur Produkte anzuzeigen, die auf Lager verfügbar sind, oder sie in einer bestimmten Reihenfolge anzuordnen. Mit Datenressourcenskripts können Sie anpassen, wie UI Builder die Informationen behandelt, z. B. zusätzliche Regeln oder Aktionen hinzufügen.

• Fügen Sie einer Seite Datenressourcen hinzu, und konfigurieren Sie sie
  Fügen Sie Datenressourcen hinzu, um Daten aus Tabellen, Datensätzen oder anderen Elementen auf Ihrer Seite in UI Builderdynamisch verfügbar zu machen.
• Daten mithilfe von Controllern an UI Builder-Seiten binden (erweiterte Funktion)
  Controller vereinfachen die Verknüpfung von Daten und Event-Logik, um Komponentenvoreinstellungen in UI Builderzu ermöglichen.
• Verbinden Sie Daten mit Ihren Komponenten
  Binden Sie Daten, die von lokalen Datenressourcen verfügbar gemacht werden, an Komponenten auf Ihrer Seite UI Builder.
• Client-Statusparameter erstellen und an eine Komponente binden (erweiterte Funktion)
  Erstellen Sie einen Client-Statusparameterwert, und binden Sie ihn an eine Komponente in UI Builder. Durch Hinzufügen benutzerdefinierter Werte zu Ihren Komponenten können diese Komponenten automatisch über ein Skript aktualisiert werden.
• Clientskripts definieren und an Komponenten binden
  Fügen Sie Client-Skripts in UI Builder hinzu, und bearbeiten Sie sie, damit Sie den Client-Status über Events aktualisieren können. Sie können diese Skripts mithilfe eines Event Handlers an eine beliebige Komponente binden.
• Arbeiten Sie mit der Entity View Action Mapper für UI Builder
  Mit UI Builderkönnen Sie die Anwendung Entity View Action Mapper (EVAM) verwenden, um zu standardisieren, wie die Datenquellen in Ihren Komponenten in Ihren Karten und Listen angezeigt werden.