Verwenden Sie ein Objekt, um verwandte Felder zu gruppieren, und ein Array für eine Liste. Mit dieser Struktur kann HTML einzelne Werte lesen und Inhalte für jedes der Vorlage bereitgestellte Element erstellen.
Dieses Handbuch beginnt mit Empfängerdetails, fügt eine Liste von Elementen hinzu und stellt diese Liste als Tabellenzeilen dar.
1. Felder mit Objekt gruppieren
Fügen Sie unter Parameters → Schema recipient hinzu, wählen Sie Objekt und fügen Sie zwei Textfelder hinzu: name und email.
Die Daten sehen so aus:
{
"recipient": {
"name": "Tembuilder",
"email": "[email protected]"
}
}Verschachtelte Felder mit Punktnotation lesen: {{ params.recipient.name }} und {{ params.recipient.email }}.
2. Deklarieren Sie eine Liste mit Array
Fügen Sie items hinzu, wählen Sie Array und setzen Sie seine Elementstruktur auf Objekt. Fügen Sie dieser Struktur einen Text name und eine Nummer quantity hinzu.
{
"items": [
{ "name": "Item A", "quantity": 2 },
{ "name": "Item B", "quantity": 1 }
]
}Deklarieren Sie die Felder des Elements einmal; Sie gelten für jedes Element in der Liste. Geben Sie ein tatsächliches Array an, anstatt die gesamte JSON-Liste in ein Textfeld einzufügen.
3. Generieren Sie jeweils Tabellenzeilen
Verwenden Sie eine each-Schleife im Abschnitt HTML:
<table>
<thead><tr><th>Item</th><th>Quantity</th></tr></thead>
<tbody>
{{#each params.items}}
<tr><td>{{ name }}</td><td>{{ quantity }}</td></tr>
{{else}}
<tr><td colspan="2">No items yet</td></tr>
{{/each}}
</tbody>
</table>Innen gehören each, name und quantity zum aktuellen Artikel. Der else-Zweig wird gerendert, wenn das Array leer ist.
Für eine lange Tabelle fügen Sie die Kopfzeile in „“ ein<thead> und lassen Sie den Abschnitt auf mehrere Blätter aufteilen. Siehe Lange Tabellen und Paginierung.
{{#each params.items}} {{ name }} · {{ quantity }}{{else}} No items yet{{/each}}4. Listen ohne verschachtelte Felder
Legen Sie für einfache Werte den Elementtyp eines Arrays auf Text, Zahl oder Boolean statt Objekt fest. tags ist beispielsweise ein Array von Text:
{ "tags": ["Design", "Review", "Approved"] }Verwenden Sie this, um das Element selbst innerhalb der Schleife zu lesen:
{{#each params.tags}}
<span>{{ this }}</span>
{{/each}}Objekt- und Array-Daten erscheinen beide in Payload und können nach Run kopiert werden.
{ "tags": ["Design", "Review", "Approved"] }Weitere Informationen zu Bedingungen, Umfang, Escapezeichen und erweiterten Beispielen finden Sie in der SyntaxreferenzHandlebars](/docs/de/data/handlebars/).