Fügen Sie Repeater zu Komponenten hinzu

  • Freigeben Version: Washingtondc
  • Aktualisiert 1. Februar 2024
  • 3 Minuten Lesedauer
  • Verwenden Sie in UI BuilderRepeater, um eine oder mehrere Komponenten mit Ergebnissen aus einer Datenressource zu wiederholen.

    Vorbereitungen

    Erforderliche Rolle: ui_builder_admin

    Warum und wann dieser Vorgang ausgeführt wird

    Die Repeater-Komponente fungiert als Basisschleife, die die Daten wiederholt, die Sie in mehreren Komponenten innerhalb von UI Builderangeben . Repeater verwenden ein Array oder ein Array von Objekten. Beispiel: Das Array [{"task": "A"},{"task": "B"}] wiederholt den darin enthaltenen Inhalt zweimal. Mit Repeatern können Sie Werte an eine Daten-Array-Eigenschaft binden. @item.value.{property_name} bindet die Werte an die Komponente innerhalb der Repeater. Wenn Sie eine Aufgabe binden möchten, können Sie sie als @item.value.taskbinden, und der Repeater zeigt den korrekten Wert an.

    Komponenten innerhalb eines Repeaters wiederholen die Anzahl der Elemente in der Datenquelle, unabhängig davon, ob die Komponentenausgabe dynamisch gemacht wird oder nicht. Angenommen, Sie platzieren eine Header-Komponente in einem Repeater mit drei Datenelementen, ändern das Feld Bezeichnung jedoch nicht. Dann sehen Sie drei Instanzen des Headers mit derselben Ausgabebezeichnung.

    Prozedur

    1. Navigieren zu Alle > Now-Experience-Framework > UI Builder.
    2. Öffnen Sie eine Experience, oder erstellen Sie eine Experience, indem Sie + Erstellenauswählen.
      Weitere Informationen zum Erstellen von Experiences finden Sie unter Konfigurieren Sie, wie Benutzer mit Ihren Anwendungen in interagieren UI Builder.
    3. Öffnen Sie den Editor für die Seite, auf der Sie den Repeater hinzufügen möchten.
      Wenn Sie keine Seite für Ihre Experience erstellt haben, finden Sie unter Erstellen Sie eine Seite in UI Builder weitere Informationen zum Erstellen einer Seite.
    4. Verbinden Sie eine Datenressource mit Ihrer Seite.

      Fügen Sie Ihrer Seite beispielsweise die Datenressource Mehrere Datensätze suchen hinzu. Weitere Informationen zum Verbinden einer Datenressource finden Sie unter Fügen Sie einer Seite Datenressourcen hinzu, und konfigurieren Sie sie.

      1. Wählen Sie die Datenressource Mehrere Datensätze nachschlagen aus.
      2. Konfigurieren Sie die Datenressource für die Verwendung der Incident -Tabelle.
      3. Geben Sie im Feld Max. Ergebnisse den Wert 5ein.

        Die Datenressource Nach mehreren Datensätzen suchen ist konfiguriert.

        Datenressourcenkonfiguration mit ausgewählter Incident-Tabelle, hinzugefügten Rückgabefeldern „geöffnet“ und „Kurzbeschreibung“, maximale Ergebnisse auf 5 festgelegt.
    5. Wählen Sie einen vorhandenen Container aus, oder erstellen Sie ein Spaltenlayout.
      Weitere Informationen finden Sie unter Organisieren Sie Komponenten auf UI Builder-Seiten.
    6. Fügen Sie die Repeater-Komponente zu Ihrer Seite hinzu.
      Pfeil, der auf die Repeater-Komponente in der Toolbox zeigt.

      Weitere Informationen zum Hinzufügen von Komponenten finden Sie unter Fügen Sie Komponenten hinzu, und konfigurieren Sie sie.

    7. Wählen Sie auf der Registerkarte Konfigurieren die Option Keine aus, um die Komponente manuell zu konfigurieren.
    8. Fügen Sie auf der Registerkarte Konfigurieren ein Array hinzu, das die Daten für wiederholte Komponenten definiert.
      1. Zeigen Sie auf Daten-Array, und wählen Sie das Symbol „Daten binden“ (Symbol für dynamische Datenbindung).
      2. Wählen Sie unter Datentypendie Datenressourceaus.
      3. Wählen Sie unter Pillenansichtdie Pille Look_up_multiple_records_1 aus.
      4. Doppelklicken Sie in der nächsten Spalte auf Ergebnisse, oder ziehen Sie sie, um die Ausgabe @data.look_up_multiple_records_1.results hinzuzufügen.
      5. Wählen Sie Übernehmen.

        Die Ergebnisse aus der Datenressource sind an die Repeater-Komponente gebunden. Innerhalb des Repeaters stellt eine Komponente jedes Ergebnis dar.

        Datenbindungskonfiguration mit @data.look_up_multiple_records_1.results hinzugefügt
    9. Wählen Sie unter dem Repeater, den Sie im vorherigen Schritt hinzugefügt haben Komponentehinzufügen aus.
      Komponentenlink in der Inhaltsstruktur hinzufügen.

      Fügen Sie beispielsweise eine Überschriftenkomponente hinzu.

    10. Wählen Sie auf der Registerkarte Konfigurieren die Option Keine aus, um die Überschriftenkomponente manuell zu konfigurieren.
    11. Konfigurieren Sie die Komponente, die Sie im Repeater verschachtelt haben.

      Binden Sie beispielsweise displayValue an die Komponente. Weitere Informationen finden Sie unter Verbinden Sie Daten mit Ihren Komponenten.

      1. Bewegen Sie den Cursor zum Feld Bezeichnung, und wählen Sie das Symbol „Daten binden“ (Symbol „ Dynamische Datenbindung“ ).
      2. Wählen Sie unter Datentypendie Option Repeateraus.
      3. Wählen Sie unter Pillenansichtdie Wertepille aus.
      4. Wählen Sie in der nächsten Spalte die Nummernpille aus.
      5. Doppelklicken oder ziehen Sie in der nächsten Spalte displayValue, um die Ausgabe @item.value.number.displayValue hinzuzufügen.
      6. Wählen Sie Übernehmen.

        displayValue ist an die Heading-Komponente gebunden.

        Datenbindungskonfiguration mit @item.value.number.displayValue hinzugefügt
    12. Wählen Sie Speichern.

      Nur der erste Wert eines Datensatzes wird in der Phase angezeigt.

      Die Überschriftenkomponente zeigt den ersten Datensatz in der Vorschau an.
    13. Zeigen Sie Ihre Seite an, und testen Sie sie, indem Sie auf die Schaltfläche Vorschau klicken.
      Eine Registerkarte wird geöffnet, um die Seitenvorschau mit wiederholten Daten anzuzeigen.

      Die Seitenvorschau zeigt alle Daten aus wiederholten Komponenten an.