Repeater

Überblick

Die Repeater-Komponente erstellt dynamische, sich wiederholende Abschnitte aus Ihrer Datenquelle. Sie funktioniert wie eine Schleife – Sie entwerfen eine Vorlage einmal mit Avonni-Komponenten, und der Repeater erzeugt diese Vorlage für jeden Datensatz in Ihrer Abfrage oder Variable.

Wesentliche Funktionen

  • Vollständige Layoutkontrolle: Im Gegensatz zu standardmäßigen Listenansichten mit festen Spalten definieren Sie genau, wie jedes Element angezeigt wird – kombinieren Sie Text, Metriken, Avatare, Schaltflächen, Fortschrittsbalken, und mehr in beliebiger Anordnung

  • Datenbindung: Greifen Sie auf die Daten des aktuellen Datensatzes mit {!Repeater1.CurrentRecord.FieldName} oder verwandte Objekte über {!Repeater1.CurrentRecord.Account.Name}

  • Verschachtelte Abfragen: Komponenten innerhalb des Repeaters können eigene Datenquellen haben – platzieren Sie z. B. eine Metrik, die die untergeordneten Opportunities für jeden Account in der Schleife summiert

  • Integrierte Steuerelemente: Enthält von Haus aus Pagination, Suche, Filterung und responsive Layouts

Gängige Anwendungsfälle

Kartenbasierte Datensatzanzeigen, Produktgalerien, durchsuchbare Verzeichnisse, Dashboard-Abschnitte, aggregierte Datenansichten, Genehmigungswarteschlangen und Ressourcenbibliotheken.

Einschränkung: Data Display-Komponenten können aus Leistungsoptimierungsgründen nicht zum Repeater hinzugefügt werden.


Schnellstart: Hochpreisige Opportunities in einem visuellen Raster anzeigen

Szenario: Ihr Verkaufsteam muss schnell identifizieren, welche Interessenten es sich lohnt, weiterzuverfolgen. Anstatt durch eine einfache Listenansicht zu scrollen, erstellen Sie ein visuelles Dashboard, das Hochwert-Opportunities (10.000 $+) in der Prospecting-Phase als scannbare Karten anzeigt.

Was Sie bauen werden: Ein 3-spaltiges Kartenraster, in dem jede Karte das Symbol, den Namen und den Deal-Wert einer Opportunity zeigt – automatisch gefiltert auf Prospecting-Stage-Deals über 10.000 $.

Erstellungszeit: 5 Minuten.

1

Fügen Sie den Repeater zu Ihrer Dynamic Component hinzu

Öffnen Sie die Avonni Dynamic Components App und erstellen Sie eine neue Dynamic Component (oder öffnen Sie eine vorhandene). Ziehen Sie aus der Komponentenbibliothek den Repeater auf Ihre Leinwand.

2

Verbinden Sie Ihre Daten

  • Setzen Sie die Datenquelle auf Abfrage

  • Klicken Sie auf den Abfrage-Builder, um eine neue Abfrage für das Opportunity Objekt

  • Fügen Sie Ihre Filter hinzu, um die Daten einzuschränken:

    • Betrag größer als 10000

  • (Optional) Sortieren nach Betrag absteigend, um die größten Deals zuerst anzuzeigen

  • Klicken Sie Fertig um Ihre Abfrage zu speichern

3

Erstellen Sie Ihre Opportunity-Karte

Nun zum spaßigen Teil – erstellen wir eine ansprechende Karte für jede Opportunity:

  • Ziehen Sie ein Media Object Komponente in den Slot des Repeaters

  • Fügen Sie im linken Slot des Media Objects ein Avatar Komponente hinzu:

    • Setzen Sie den Fallback-Icon-Namen auf standard:opportunity

    • Setzen Sie Initialen auf {!Repeater1.CurrentRecord.Name} (dies zeigt die Anfangsbuchstaben des Opportunity-Namens) und stellen Sie es auf „Initial Auto Formatted“ ein

  • Fügen Sie im Hauptinhaltsbereich des Media Objects einen Text Komponente hinzu:

    • Wert auf {!Repeater1.CurrentRecord.Name}

    • Machen Sie ihn mit den Formatierungsoptionen fett

  • Unter diesem Text fügen Sie eine Metrik Komponente hinzu:

    • Setzen Sie das Label auf „Deal Value“

    • Setzen Sie den Wert auf {!Repeater1.CurrentRecord.Amount}

    • Währungformatierung aktivieren

    • Fügen Sie ein Icon wie utility:moneybag zur optischen Aufwertung hinzu

4

Passen Sie das Repeater-Layout an

Machen Sie Ihr Dashboard optisch organisiert und professionell:

Konfigurieren Sie das Raster-Layout Im Layout-Bereich:

  • Setzen Sie Anzahl der Spalten auf 3 (ordnet Opportunities in einem 3-spaltigen Raster an)

  • Setzen Sie Teiler auf Karte Stil (fügt visuelle Trennung zwischen den einzelnen Opportunity-Karten hinzu)

Fügen Sie einen Dashboard-Titel hinzu Im Header-Bereich:

  • Setzen Sie Titel auf etwas Beschreibendes wie „High-Value Prospects“ oder „Priority Pipeline“

  • (Optional) Fügen Sie eine Bildunterschrift wie „Prospecting stage • $10K+“ hinzu

Dies erstellt ein poliertes, scannbares Dashboard anstelle einer einfachen gestapelten Liste

5

Speichern und auf einer Lightning-Seite hinzufügen

Nachdem Ihre Dynamic Component erstellt und gespeichert wurde, müssen Sie sie auf einer Lightning-Seite platzieren, damit Benutzer sie tatsächlich sehen können. Der Lightning App Builder verwendet eine generische AX - Dynamic Component Hülle, die Sie auf die Seite ziehen und dann konfigurieren, um Ihre spezifische Komponente anzuzeigen

  1. Klicken Sie Speichern im Dynamic Component-Builder, dann Aktivieren Ihre Komponente

  2. Öffnen Sie Lightning App Builder und navigieren Sie zu der Seite, auf der Sie das Dashboard haben möchten (Startseite, Opportunities-Seite usw.)

  3. Ziehen Sie aus der Komponentenliste links die AX - Dynamic Component auf Ihre Seite

  4. Im Eigenschaftsbereich auf der rechten Seite verwenden Sie das Dropdown, um Ihre neu erstellte Dynamic Component auszuwählen aus der Liste der verfügbaren Komponenten

  5. Speichern und Aktivieren die Seite

Ihr High-Value-Prospecting-Dashboard ist jetzt live! Vertriebsmitarbeiter können nun schnell scannen, welche Deals priorisiert werden sollen, ohne durch Listenansichten zu scrollen.

Das war's! Sie haben gerade ein professionelles Opportunity-Dashboard erstellt, das Opportunity-Namen, Avatare und Deal-Werte in einem ansprechenden Kartenlayout anzeigt – eine Karte für jeden Datensatz, den Ihre Abfrage zurückgibt. Sobald Sie Ihre Dynamic Component speichern, können Sie sie auf jeder Lightning-Seite platzieren (Account-Seiten, Startseite, benutzerdefinierte App-Seiten) und sie zeigt automatisch Ihre Opportunities an.

Von hier aus können Sie Ihre Karten weiter verbessern, indem Sie Schaltflächen hinzufügen (um zu Datensätzen zu navigieren), zusätzliche Metriken (Close-Datum, Wahrscheinlichkeit) oder Status-Badges (Phasenindikatoren mit Farben).


Wie der Repeater funktioniert: Kernkonzepte

Bevor Sie mit der detaillierten Konfiguration beginnen, helfen Ihnen diese drei Kernkonzepte, den Repeater effizient zu konfigurieren.

1. Datenquelle → Vorlage → Ausgabe

Der Repeater folgt einem einfachen Ablauf:

  • Datenquelle: Sie definieren, welche Daten wiederholt werden sollen (eine Salesforce-Abfrage oder Variable)

  • Vorlage: Sie entwerfen, wie ein Element aussehen soll (indem Sie Komponenten in den Slot des Repeaters platzieren)

  • Ausgabe: Der Repeater erzeugt Ihre Vorlage automatisch für jeden Datensatz

Beispiel: Abfrage 50 Kontakte → Entwerfen Sie eine Kontaktkarte → Erhalten Sie automatisch 50 Kontaktkarten

2. Datenbindung verbindet Vorlage mit Datensätzen

Komponenten innerhalb des Repeaters greifen mit folgender Syntax auf die Daten des aktuellen Datensatzes zu:

Aufgeschlüsselt:

  • RepeaterAPIName - Der API-Name Ihres Repeaters (zu finden im Eigenschaftsbereich, z. B. „Repeater1“)

  • CurrentRecord - Verwenden Sie immer exakt diesen Text – er referenziert den Datensatz, der gerade angezeigt wird

  • FieldName - Der Salesforce-Feld-API-Name, den Sie anzeigen möchten (z. B. Name, Betrag, Account.Name)

Gängige Bindungsbeispiele:

  • {!Repeater1.CurrentRecord.Name} - Datensatzname anzeigen

  • {!Repeater1.CurrentRecord.Amount} - Opportunity-Betrag anzeigen

  • {!Repeater1.CurrentRecord.Account.Name} - Zugehörigen Account-Namen anzeigen

  • {!Repeater1.CurrentRecord.Owner.Email} - E-Mail des Eigentümers anzeigen

3. Komponenten in Komponenten (verschachtelte Abfragen)

Hier wird der Repeater mächtig: Komponenten, die Sie in den Repeater-Slot legen, können eigene Datenquellen haben. Das ermöglicht Aggregation und Eltern-Kind-Beziehungen.

Beispielszenario: Zeigen Sie jeden Account Executive mit seinem gesamten Pipeline-Wert

  • Äußerer Repeater: Fragt das User-Objekt ab → ein Abschnitt pro Benutzer

  • Innere Metrik: Fragt das Opportunity-Objekt mit Filter ab OwnerId = {!Repeater1.CurrentRecord.Id} → zeigt die Summe für diesen speziellen Benutzer

Dieses Muster funktioniert, weil jede Komponente im Repeater den aktuellen Datensatz „sehen“ und ihre eigene Abfrage entsprechend filtern kann.


Konfigurationsarbeitsablauf

Folgen Sie diesem Arbeitsablauf, um jede Repeater-Komponente zu konfigurieren:

Schritt 1: Komponente hinzufügen und benennen Ziehen Sie den Repeater auf Ihre Dynamic Component-Leinwand. Legen Sie im Eigenschaftsbereich einen klaren API-Namen fest (z. B. „ContactRepeater“, „OppCards“), da Sie diesen in Bindungen referenzieren werden.

Schritt 2: Verbinden Sie Ihre Datenquelle

Konfigurieren Sie im Eigenschaftsbereich die Datenquelle:

  • Wählen Sie Abfrage für Salesforce-Objekte oder Variable für vordefinierte Daten

  • Wenn Sie Abfrage verwenden: Objekt auswählen, Filter hinzufügen, Sortierreihenfolge festlegen

  • Vorschau Ihrer Abfrageergebnisse, um zu überprüfen, ob Daten korrekt zurückgegeben werden

Schritt 3: Entwerfen Sie Ihre Vorlage

Ziehen Sie Komponenten in den Slot des Repeaters, um zu gestalten, wie ein Element aussehen soll:

  • Beginnen Sie mit einer Strukturkomponente (Media Object ist üblich für Karten)

  • Fügen Sie Anzeige-Komponenten hinzu (Text, Metric, Avatar usw.)

  • Fügen Sie Interaktionskomponenten hinzu (Buttons für Aktionen)

  • Binden Sie jede Komponente an die Daten des aktuellen Datensatzes mit {!RepeaterAPIName.CurrentRecord.FieldName}

Schritt 4: Layout konfigurieren

Legen Sie im Layout-Bereich fest, wie wiederholte Elemente angeordnet werden:

  • Ausrichtung: Horizontal (Raster) oder Vertikal (gestapelt)

  • Spalten: Legen Sie Standard- und responsive Breakpoints fest (Klein/Mittel/Groß)

  • Teiler: Fügen Sie visuelle Trennung zwischen Elementen hinzu (Card, Solid, Space usw.)

Schritt 5: Optionale Steuerelemente hinzufügen

Verbessern Sie die Benutzerfreundlichkeit mit diesen optionalen Funktionen:

  • Kopfzeile: Titel, Untertitel, Elementanzahl, Aktionsschaltflächen hinzufügen

  • Seitennavigation: Aktivieren für große Datensätze, Anzahl der Elemente pro Seite festlegen

  • Suche: Durchsuchbare Felder zuordnen, damit Benutzer Ergebnisse filtern können

  • Filter: Reaktive Filter hinzufügen, die Benutzer umschalten können

  • Seitenleiste: Erstellen Sie eine erweiterbare Detailansicht für jedes Element

Schritt 6: Responsiv testen

Vorschau Ihres Repeaters in verschiedenen Bildschirmgrößen:

  • Überprüfen Sie, dass sich die Spalten entsprechend anpassen (insbesondere auf Mobilgeräten)

  • Prüfen Sie, dass Bindings die korrekten Daten anzeigen

  • Testen Sie Pagination, Suche und Filter, falls aktiviert

  • Stellen Sie sicher, dass verschachtelte Abfragen die erwarteten Aggregationen zurückgeben

Wichtiges Prinzip: Der Repeater ist ein Multiplikationswerkzeug. Was immer Sie im Slot bauen, wird mit der Anzahl der Datensätze in Ihrer Datenquelle multipliziert. Entwerfen Sie ein Element gut, und der Repeater übernimmt den Rest.


Konfiguration

Grundlegende Eigenschaften

Der Abschnitt Grundlegende Eigenschaften definiert, wie Ihr Repeater mit Daten verbunden ist und wiederholte Inhalte anzeigt. Diese Einstellungen bestimmen, welche Datensätze angezeigt werden, wie sie gefiltert werden und wie Benutzer mit den Daten interagieren.

Eigenschaft
Typ
Beschreibung
Beispiel

API-Name

Text

Eindeutiger Bezeichner (in Bindungen verwendet wie {!Repeatable1.CurrentRecord.Field}).

OppRepeater

Datenquelle

Auswählen

Quelle für die Wiederholung: Variable (aus der Variable-Ressource) oder Abfrage (Salesforce-Abfrage).

Abfrage (Opportunity-Objekt).

Datenzuordnungen

Einstellungen

Unteroptionen: Filter (reaktive Bedingungen), Suchfelder (für durchsuchbare Spalten), Keine-Ergebnisse-Nachricht (benutzerdefinierter Text bei Leerstand).

Filter: Stage = "Closed Won"; Nachricht: "Keine Opportunities gefunden."

Beste Praxis: Verwenden Sie Abfragen für Salesforce-Daten; ordnen Sie Filter Variablen zu für dynamische Steuerung.

Layout

Der Layout-Bereich steuert, wie wiederholte Abschnitte innerhalb Ihrer Komponente angezeigt werden. Diese Optionen ermöglichen es Ihnen, Inhalte responsiv über verschiedene Bildschirmgrößen zu arrangieren – egal ob Sie ein Einspaltenformular, ein mehrspaltiges Dashboard oder ein dynamisches Raster entwerfen.

Eigenschaft
Typ/Bedingung
Beschreibung
Optionen/Beispiele

Ausrichtung

Auswählen

Abschnittsfluss: vertikal (gestapelt) oder horizontal (Raster).

horizontal.

Anzahl der Spalten

Auswählen

Standardspalten: 1, 2, 3, 4, 6, 12.

3.

Anzahl der Spalten Klein

Auswählen

Spalten für kleine Bildschirme/Container.

1.

Anzahl der Spalten Mittel

Auswählen

Spalten für mittlere Bildschirme/Container.

2.

Anzahl der Spalten Groß

Auswählen

Spalten für große Bildschirme/Container.

4.

Teiler

Umschalten/Auswählen

Fügen Sie Trennlinien zwischen Abschnitten hinzu (z. B. Linien oder Abstände).

Ein, Stil: „solid“.

Tipp

Kopfzeile

Der Header-Bereich ermöglicht es Ihnen, eine reichhaltige und informative Kopfzeile für Ihren Repeater zu definieren. Diese Kopfzeile kann einen Titel, Untertitel, Symbole oder Avatare und Aktionstasten enthalten und den Benutzern sofort Kontext und interaktive Steuerungen bieten. Sie können auch Metadaten wie Elementanzahlen anzeigen und die Kopfzeile visuell mit ihrem Inhalt verbinden.

Eigenschaft
Typ
Beschreibung
Beispiel

Titel

Text

Hauptkopfzeilentext.

"Opportunities"

Bildunterschrift

Text (Optional)

Untertext unter dem Titel.

"Aktive Deals"

Avatar

Einstellungen

Unteroptionen: Bild (URL), Fallback-Icon-Name (SLDS-Icon), Initialen (Text).

Icon: standard:opportunity

Hilfetext

Text (Optional)

Hinweis-Tooltip.

"Klicken, um Details anzuzeigen."

Ist verbunden

Boolean

Verbindet die Kopfzeile visuell mit dem Inhalt (z. B. keine untere Rahmenlinie).

Ein.

Elementanzahl anzeigen

Boolean

Zeigt die Anzahl der Elemente an (z. B. „5 Elemente“).

Ein.

Aktion

Einstellungen

Fügen Sie Kopfzeilen-Schaltflächen für Aktionen hinzu (in Interactions konfigurieren).

"Neu hinzufügen"-Schaltfläche.

Aktionen verbergen

Boolean

Versteckt Aktionsschaltflächen.

Aus.

Aktionen deaktivieren

Boolean

Deaktiviert Aktionsschaltflächen.

Aus.

Pagination, Filter und Suche

Dieser Abschnitt verbessert die Navigation und Datenverwaltung für wiederholte Elemente, insbesondere bei großen Datensätzen. Diese Steuerungen helfen Benutzern, Elemente leicht zu finden, durch Seiten zu blättern und die angezeigten Elemente zu verfeinern.

Eigenschaft
Typ/Bedingung
Beschreibung

Pagination anzeigen

Boolean

Ermöglicht Paging; legen Sie die Anzahl der Elemente pro Seite fest (z. B. 10).

Anzahl der Elemente pro Seite

Anzahl (wenn Pagination eingeschaltet)

Anzahl der pro Seite angezeigten Elemente.

Filtertyp

Auswählen

Filteranzeige: horizontal (inline), Popover (Dropdown), Panel (Seite).

Suche anzeigen

Boolean

Fügt eine Suchleiste hinzu; verwendet zugeordnete Suchfelder.

Seitenleiste

Die Einstellungen für die Seitenleiste steuern, wo Filter- und Suchsteuerungen erscheinen, wenn der Filtertyp „Panel“ verwendet wird. Anstatt Filter inline mit Ihrem Inhalt anzuzeigen, erstellt das Panel eine einklappbare Seitenleiste für ein saubereres Layout.

Eigenschaft
Typ
Beschreibung
Optionen/Beispiele

Position

Auswählen

Panel-Position: links oder rechts.

rechts.

Ist geschlossen

Boolean

Anfangszustand: Ein = eingeklappt.

Ein.

Toggle-Schaltfläche verbergen

Boolean

Versteckt den Umschalter zum Öffnen/Schließen.

Aus.

Bezeichnung der Zurücksetzen-Schaltfläche

Text

Beschriftung für die Zurücksetzen-Schaltfläche im Panel.

"Löschen".

Wann Sie die Seitenleiste verwenden sollten

  • Sie haben mehrere Filteroptionen und möchten Ihren Hauptinhaltsbereich sauber halten

  • Benutzer benötigen Zugriff auf Filter, müssen diese aber nicht ständig sichtbar haben

  • Sie bauen ein durchsuchbares Verzeichnis oder Katalog, bei dem Filter dem Browsen nachgeordnet sind

Wie es funktioniert

  1. Im Filter Abschnitt, setzen Sie Filtertyp auf „panel“

  2. Konfigurieren Sie die Seitenleiste Position (links oder rechts)

  3. Setzen Sie Ist geschlossen auf Ein, wenn Sie möchten, dass das Panel standardmäßig eingeklappt ist

  4. Benutzer klicken die Umschalt-Schaltfläche, um das Filterpanel zu öffnen/zu schließen

Tipp: Verwenden Sie die Panel-Position auf der gegenüberliegenden Seite Ihrer Hauptaktionen. Wenn Sie z. B. Aktionsschaltflächen auf der rechten Seite der Karten haben, platzieren Sie das Filterpanel links, um visuelle Überfüllung zu vermeiden


Beispiele

Beispiel 1: Account Executives nach gesamtem Opportunity-Betrag auflisten

Zeigen Sie eine Liste von Account Executives und deren gesamten in diesem Jahr geschlossenen Opportunity-Beträgen an. Dieses Beispiel verwendet den Avonni Repeater, um durch eine Abfrage zu iterieren, und die Avonni Metric-Komponente, um die Ergebnisse für jeden Executive anzuzeigen.

1

Fügen Sie den Avonni Repeater hinzu

Beginnen Sie, indem Sie das Avonni Repeatable auf Ihre Seite ziehen. Diese Komponente ermöglicht es Ihnen, wiederholte Inhalte anzuzeigen – jeweils eines für jeden Account Executive.

2

Konfigurieren Sie die Datenquelle

Suchen Sie im Eigenschaftsbereich des Repeaters den Abschnitt Grundlegende Eigenschaften und setzen Sie die Datenquelle auf „Query“. Klicken Sie auf die Konfigurationsschaltfläche, um den Abfrage-Builder zu öffnen. Im Abfrage-Builder:

  • Wählen Sie das User Objekt aus dem Objekt-Dropdown

  • Fügen Sie einen Filter hinzu, um auf Account Executives einzugrenzen: Klicken Sie auf „Filter hinzufügen“ und setzen Sie UserRole.Name gleich „Account Executive“ (oder verwenden Sie Profile.Name falls Ihre Organisation Rollen anders strukturiert)

  • Optional können Sie einen weiteren Filter wie IsActive gleich „True“ hinzufügen, um nur aktive Benutzer anzuzeigen

  • Klicken Sie auf „Fertig“, um Ihre Abfrage zu speichern

Der Repeater ruft nun alle aktiven Account Executives in Ihrer Organisation ab.

3

Fügen Sie eine Metrik innerhalb des Repeatable ein

Ziehen Sie aus der Komponentenbibliothek die Avonni Metric Komponente in den Slot-Bereich des Repeaters (der leere Bereich mit der Bezeichnung „Drop components here“). Sobald platziert, klicken Sie auf die Metric-Komponente, um deren Eigenschaftsbereich zu öffnen. Im Abschnitt Grundlegende Eigenschaften:

  • Setzen Sie die Datenquelle auf „Query“

  • Klicken Sie auf die Abfrage-Konfigurationsschaltfläche

  • Wählen Sie das Opportunity Objekt

  • Wählen Sie im Feldbereich Betrag aus dem Dropdown

  • Setzen Sie die Aggregatfunktion auf SUMME (dies berechnet die Summe aller Opportunity-Beträge)

  • Lassen Sie vorerst alle Filter leer – den wichtigen Filter fügen wir im nächsten Schritt hinzu

  • Klicken Sie auf „Fertig“, um zu speichern

An diesem Punkt fragt die Metrik alle Opportunities in Ihrer Organisation ab, aber wir müssen sie filtern, damit nur Opportunities für jeden spezifischen Benutzer angezeigt werden.

4

Nach Benutzer filtern

Dies ist der entscheidende Schritt, der jede Metrik mit dem entsprechenden Account Executive verbindet. Während die Metric-Komponente noch ausgewählt ist, gehen Sie zurück zur Abfragekonfiguration:

  • Klicken Sie im Abfrage-Builder auf „Filter hinzufügen“

  • Setzen Sie das Filterfeld auf OwnerId (dies ist das Feld, das verfolgt, wer jede Opportunity besitzt)

  • Setzen Sie den Operator auf „Equals“

  • Für den Wert klicken Sie auf das Formel-/Variablen-Symbol und geben ein: {!Repeater1.CurrentRecord.Id} (wenn der API-Name Ihres Repeaters von „Repeater1“ abweicht, verwenden Sie stattdessen diesen Namen)

  • Klicken Sie auf „Fertig“

Diese Bindung stellt sicher, dass die Metric beim Durchlaufen jedes Account Executives durch den Repeater nur Opportunities zählt, die diesem speziellen Benutzer gehören. Die {!Repeater1.CurrentRecord.Id} referenziert dynamisch die ID des aktuellen Benutzers in jeder Iteration..

5

Metrikeinstellungen anpassen

Jetzt, da die Daten korrekt fließen, verfeinern Sie das Erscheinungsbild der Metrik für bessere Lesbarkeit:

  • Avatar aktivieren (optional):

    • Scrollen Sie im Eigenschaftsbereich der Metric zum Avatar-Bereich

    • Schalten Sie „Avatar anzeigen" auf Ein

    • Stellen Sie den Avatar-Typ auf „Initialen“

    • Setzen Sie den Initialen-Wert auf {!Repeater1.CurrentRecord.Name} um die Initialen des Benutzers anzuzeigen

    • Dies erstellt einen visuellen Identifikator für jeden Account Executive

  • Beschriftungen aktualisieren:

    • Setzen Sie das Label auf etwas Beschreibendes wie „Total Pipeline“ oder „Closed Won Amount“

    • Optional fügen Sie ein Unterlabel mit {!Repeater1.CurrentRecord.Name} hinzu, um den Namen des Executives anzuzeigen

  • Wert formatieren:

    • Stellen Sie im Abschnitt Wertformatierung den Formattyp auf „Währung“

    • Wählen Sie Ihr Währungssymbol ($ für USD, € für EUR usw.)

    • Legen Sie Dezimalstellen fest (typischerweise 0 für ganze Dollarbeträge)

  • Visuelle Elemente hinzufügen:

    • Fügen Sie im Icon-Bereich ein Icon hinzu wie utility:moneybag oder utility:trending

    • Wählen Sie eine Icon-Farbe, die zu Ihrem Branding passt

    • Erwägen Sie, basierend auf Leistungsgrenzen eine Hintergrundfarbe oder Stilvariante (Erfolg, Warnung) hinzuzufügen

6

Endergebnis

Sobald alles eingerichtet ist, haben Sie eine saubere, wiederholbare Liste von Metric-Komponenten – jede zeigt den gesamten Betrag geschlossener Opportunities für einen anderen Account Executive. Das Layout aktualisiert sich dynamisch basierend auf Ihrer User-Abfrage, was dies zu einer leistungsstarken Methode macht, Teamleistung in Echtzeit zu visualisieren.

Beispiel 2: Mitarbeitendenverzeichnis

Dieses Beispiel zeigt eine Liste von Kontakten, die an die Datensatz-ID der aktuellen Account-Seite gebunden sind, und verwendet die Avonni Repeatable-Komponente, um für jeden Kontakt ein Media Object, Avatar und eine Schaltfläche anzuzeigen.

1

Fügen Sie das Avonni Repeatable hinzu

Ziehen Sie die Avonni Repeatable Komponente auf die Seite, auf der das Mitarbeitendenverzeichnis erscheinen soll.

2

Setzen Sie die Datenquelle auf eine Abfrage

  • Wählen Sie Abfrage als Datenquelle.

  • Wählen Sie das Kontakt Objekt

3

Wenden Sie einen Filter nach der aktuellen Account-ID an

  • Fügen Sie einen Filter hinzu, um nur Kontakte anzuzeigen, die mit dem aktuellen Account.

  • verknüpft sind Verwenden Sie die Datensatz-ID

Hinweis

  • Stellen Sie sicher, dass das Zielseitenname auf das Account Objekt

  • eingestellt ist. Dadurch kann die Komponente in einem dynamischen Kontext auf die korrekte Datensatz-ID zugreifen

4

Wiederholbares Layout anpassen

Um zu steuern, wie das Mitarbeiterverzeichnis angezeigt wird, sind die Einstellungen für wiederholbare Layouts konfiguriert, um eine saubere, strukturierte Darstellung zu bieten. Das Layout verwendet eine vertikale Ausrichtung, das heißt, die Informationen jedes Kontakts werden innerhalb seines Abschnitts vertikal gestapelt. Die Anzeige ist in einem 3-Spalten-Rasterangeordnet, sodass mehrere Kontakte nebeneinander auf der Seite erscheinen können. Zusätzlich wird ein Kartenartiger Trenner zwischen jedem Eintrag angewendet, um den Inhalt visuell zu trennen und die Lesbarkeit zu verbessern.

5

Platzieren Sie die Media-Objekt-Komponente innerhalb des wiederholbaren Elements

Ziehen Sie innerhalb des wiederholbaren Slots die Media-Objekt-Komponente, um Zugriff auf weitere Slots links und rechts zu haben, um dort andere Komponenten zu platzieren

6

Fügen Sie die Avatar-Komponente in den ersten Slot ein

Ziehen Sie die Avatar-Komponente in den linken Slot der Media-Objekt-Komponente.

7

Fügen Sie die Avonni-Schaltfläche in den rechten Slot des Media-Objekts ein

Innerhalb des Media Objectplatzieren Sie eine Avonni-Schaltfläche in den rechten Slot als Handlungsaufforderung für jeden Kontakt. Beschriften Sie die Schaltfläche mit "Anzeigen"und konfigurieren Sie deren Klick-Interaktion um Benutzer zur Datensatzseite des ausgewählten Kontakts zu navigieren. Setzen Sie hierfür die Interaktion auf: Navigieren → Datensatzseite → Contact-Objekt → Anzeigen

8

Endergebnis


Wichtige Überlegungen

  • Datenzugriff: Verwenden Sie in Slots {!API_Name.CurrentRecord.Field} für das aktuelle Element; fragen Sie untergeordnete Datensätze für Aggregationen ab.

  • Leistung: Begrenzen Sie Abfragen bei großen Datensätzen; verwenden Sie Paginierung, um Ladeprobleme zu vermeiden.

  • Responsive Design: Testen Sie Spalteneinstellungen über verschiedene Gerätegrößen hinweg.

  • Aktionen und Interaktionen: Kopfzeilenaktionen können Flows auslösen und Seitenbereiche stehen für Bearbeitungen pro Element zur Verfügung.

  • Umgang mit keinen Ergebnissen: Passen Sie die Nachricht für leere Zustände an, um Benutzer zu leiten.


Fehlerbehebung bei häufigen Problemen

Keine Elemente werden wiederholt / Der Repeater erscheint leer

Was passiert: Die Repeater-Komponente ist auf der Seite sichtbar, aber es werden keine wiederholten Abschnitte angezeigt.

Häufige Ursachen und Lösungen:

  1. Abfrage liefert keine Ergebnisse

    • Überprüfen Sie Ihre Data-Source-Abfrage im Eigenschaften-Bereich

    • Klicken Sie "Vorschau Ergebnisse" um zu sehen, ob Datensätze Ihren Kriterien entsprechen

    • Vergewissern Sie sich, dass Ihre Filter nicht zu einschränkend sind (z. B. wenn Sie nach Stage = "Closed Won" filtern, aber keine "Closed Won" Opportunities vorhanden sind, wird nichts angezeigt)

  2. Variable ist leer oder undefiniert

    • Wenn Sie eine Variable als Datenquelle verwenden, prüfen Sie, ob die Variable korrekt befüllt wird

    • Stellen Sie sicher, dass die Variable im Gültigkeitsbereich ist und auf der Seite verfügbar ist, auf der der Repeater platziert ist

    • Verwenden Sie die Debug-Konsole, um den Wert der Variable zu überprüfen

  3. Datensatzkontext fehlt

    • Wenn Ihre Abfrage nach der aktuellen Datensatz-ID filtert (wie AccountId = {!recordId}), stellen Sie sicher, dass Sie sich auf einer Datensatzseite mit einer gültigen Datensatz-ID befinden

    • Überprüfen Sie, ob der Zielseitenname in Ihren Dynamischen Komponenten-Einstellungen korrekt gesetzt ist

  4. Berechtigungsproblem

    • Bestätigen Sie, dass der aktuelle Benutzer Leserechte für das Objekt und die Felder in Ihrer Abfrage hat

    • Testen Sie mit einem Systemadministrator-Profil, um Berechtigungsprobleme auszuschließen

Wie zu überprüfen: Öffnen Sie die Browserkonsole und prüfen Sie auf Fehlermeldungen. Versuchen Sie außerdem, vorübergehend alle Filter aus Ihrer Abfrage zu entfernen, um zu sehen, ob Datensätze erscheinen

Gebundene Attribute zeigen {!Repeater1.CurrentRecord.FieldName} als reinen Text an

Was passiert: Anstatt die tatsächlichen Feldwerte anzuzeigen, sehen Sie die Bindungssyntax selbst als Text.

Häufige Ursachen und Lösungen:

  1. API-Name stimmt nicht überein

    • Der API-Name in Ihrer Bindung muss genau dem API-Name-Eigenschaft des Repeaters entsprechen

    • Überprüfen Sie den API-Namen des Repeaters im Eigenschaften-Bereich (zum Beispiel, wenn er "OppRepeater" heißt, verwenden Sie {!OppRepeater.CurrentRecord.FieldName})

    • API-Namen sind groß-/kleinschreibungssensitiv

  2. Falscher Feld-API-Name

    • Überprüfen Sie, ob der Feldname in Ihrer Bindung mit dem tatsächlichen Salesforce-Feld-API-Namen übereinstimmt

    • Bei benutzerdefinierten Feldern denken Sie daran, __c einzuschließen (zum Beispiel Custom_Field__c)

    • Bei Beziehungsfeldern verwenden Sie die Punktnotation korrekt (zum Beispiel Account.Name nicht AccountName)

  3. Komponente unterstützt keine dynamischen Attribute

    • Stellen Sie sicher, dass die Komponente in Ihrem Repeater-Slot Attributbindung unterstützt

    • Einige Eigenschaften akzeptieren möglicherweise nur statische Werte

  4. Syntaxfehler in der Bindung

    • Überprüfen Sie Ihre Bindungssyntax: {!ComponentAPIName.CurrentRecord.FieldAPIName}

    • Stellen Sie sicher, dass Sie geschweifte Klammern verwenden {}, nicht Klammern oder eckige Klammern

    • Überprüfen Sie, ob keine zusätzlichen Leerzeichen oder Tippfehler vorhanden sind

Wie zu überprüfen: Beginnen Sie mit einer einfachen Textkomponente, die {!Repeater1.CurrentRecord.Id} anzeigt, um zu bestätigen, dass die grundlegende Bindung funktioniert, und fügen Sie dann schrittweise komplexere Feldreferenzen hinzu.

Layout ist kaputt oder Elemente sind nicht richtig ausgerichtet

Paginierungssteuerungen werden nicht angezeigt

Suchfunktion funktioniert nicht

Filter beeinflussen die angezeigten Ergebnisse nicht


Zusammenfassung

Die Avonni Repeater-Komponente ist Ihre Lösung, um dynamische, datengesteuerte Listen und Raster in Salesforce ohne Programmierung zu erstellen. Durch die Kombination einer flexiblen Datenquelle mit geschachtelten Komponenten können Sie alles bauen – von einfachen Kontaktlisten bis hin zu anspruchsvollen Dashboard-Karten mit Metriken, Aktionen und interaktiven Funktionen.

Was den Repeater leistungsstark macht

  • Wirklich flexible Vorlagen: Im Gegensatz zu standardmäßigen Salesforce-Wiederholungskomponenten ermöglicht der Repeater, jede Kombination von Avonni-Komponenten in seinem Slot zu platzieren – mischen Sie Text, Metriken, Avatare, Schaltflächen, Media-Objekte und mehr, um genau das Layout zu erstellen, das Sie benötigen

  • Intelligente Datenbindung: Greifen Sie auf aktuelle Datensatzdaten mit einfacher Attributsyntax wie {!Repeater1.CurrentRecord.FieldName}zu und referenzieren Sie sogar verwandte Objekte über Punktnotation (zum Beispiel {!Repeater1.CurrentRecord.Account.Name})

  • Für den Unternehmenseinsatz geeignete Funktionen: Eingebaute Paginierung, Suche, Filterung und responsive Layouts stellen sicher, dass Ihre wiederholten Abschnitte mit großen Datensätzen und auf allen Geräten reibungslos funktionieren

  • Codefreie Aggregationen: Kombinieren Sie den Repeater mit Metrik-Komponenten, um berechnete Werte (Summen, Durchschnitte, Anzahlen) für jedes wiederholte Element anzuzeigen – perfekt, um Gesamtsummen pro Account Manager, Abteilungszusammenfassungen oder Portfolio-Analysen anzuzeigen

Wann man den Repeater verwenden sollte

  • Erstellung benutzerdefinierter Kartenlayouts, die über das hinausgehen, was Standard-Listenansichten bieten

  • Erstellen von Dashboard-Bereichen, die sich für verschiedene Kategorien wiederholen (Umsatz nach Region, Opportunities nach Phase, Cases nach Priorität)

  • Anzeigen von übergeordneten Datensätzen mit aggregierten untergeordneten Daten (Accounts mit gesamtem Opportunity-Wert, Kontakte mit Fallzahlen)

  • Gestalten gefilterter, durchsuchbarer Verzeichnisse (Mitarbeiterlisten, Produktkataloge, Ressourcenbibliotheken)

  • Ersetzen mehrerer statischer Komponenten durch eine einzige dynamische, datengesteuerte Lösung

Nächste Schritte und verwandte Ressourcen

  • Avonni Query-Komponente: Erfahren Sie, wie Sie erweiterte Abfragen mit Filtern, Sortierung und Beziehungen erstellen, um Ihren Repeater zu unterstützen

  • Anleitung zu Datenzuordnungen: Verstehen Sie, wie Sie Filter, Suchfelder und reaktive Bedingungen für dynamische Datensteuerung konfigurieren

  • Media-Objekt-Komponente: Entdecken Sie, wie Sie strukturierte Kartenlayouts mit Avataren, Inhaltsbereichen und Aktionsslots erstellen

  • Metrik-Komponente: Beherrschen Sie die Datenaggregation und die Anzeige formatierter Werte (Währung, Prozentsätze, Zahlen) innerhalb Ihrer wiederholten Abschnitte

Der Repeater verändert, wie Sie Salesforce-Daten anzeigen – er gibt Ihnen die visuelle Flexibilität kundenspezifischer Entwicklung mit der Geschwindigkeit und Wartbarkeit einer No-Code-Konfiguration

Zuletzt aktualisiert

War das hilfreich?