Loop Syntax

Loop tags allow you to dynamically repeat content in your documents. You can use them to repeat paragraphs, table rows, table columns, and list items based on your data.

To get started, follow the examples below.

Simple example

To repeat content, simply wrap it with a loop tag. The content can include constant parts as well as other tags to be replaced with data:

Provide an array in your data to populate the loop:

{
    "HealthyFood": [
        { "FruitName": "Apple" },
        { "FruitName": "Banana" },
        { "FruitName": "Orange" }
    ]
}

The resulting document will contain the list of fruits:

List items

Repeating list items is a common use case. Place the loop tag inside a list item, and the service will automatically generate a new list item for each element in your data array:

Consider the following data:

{
  "Pets": [
    { "Name": "Max", "Type": "Dog" },
    { "Name": "Jack", "Type": "Parrot" },
    { "Name": "Wendy", "Type": "Cat" }
  ]
}

The resulting document will contain the list of pets:

The same approach works for numbered lists:

And the resulting document will contain the list of pets:

Table rows

To repeat table rows, place the opening tag at the beginning of the row and the closing tag in the last cell. The service will create a new row for each item in your data array:

We'll use the same data as in the previous example:

{
  "Pets": [
    { "Name": "Max", "Type": "Dog" },
    { "Name": "Jack", "Type": "Parrot" },
    { "Name": "Wendy", "Type": "Cat" }
  ]
}

And the resulting document will now be:

Table columns

You can also repeat table columns. Place the opening tag in the first cell of the column and the closing tag in the last cell. The service will create a new column for each item in your data array:

Consider the following data:

{
    Students: [
        {
            Name: "John Doe",
            Math: "A",
            Science: "B+",
            History: "A-",
        },
        {
            Name: "Jane Smith",
            Math: "B",
            Science: "A",
            History: "A",
        },
    ],
}

The resulting document will show the student's grades across subjects:

Tips and Tricks

Repeat multiple list items in one loop iteration

You can wrap more than one list item with the same loop, so each data item produces a group of list items:

With the same Pets data from above, the output becomes:

Repeat multiple rows in one loop iteration

The same pattern works in tables: place the opening tag in the first row of the group and the closing tag in the last row of that same group.

The resulting document will be:

Override loop behavior with loopOver

Default loop behavior

When the engine detects a loop, it picks what to repeat based on built-in heuristics:

1. If both loop tags are inside the same table cell, it repeats the cell content.
2. If both loop tags are in the same table column, it repeats the column.
3. If both loop tags are inside a table (but not the same cell or column), it repeats the relevant table rows.
4. If both loop tags are inside a list, it repeats list items.
5. Otherwise, it repeats the content between the opening and closing tags.

Overriding the default

If you need to force a specific behavior, set the loopOver option on the opening loop tag. There are four possible values:

• row - Repeat one or more rows
• column - Repeat a column
• content - Repeat only the content between tags
• paragraph - Repeat one or more paragraphs

Example

Assume we have the following data:

{
  "Students": [
    { "Name": "Alice" },
    { "Name": "Bob" }
  ]
}

Notice how each option produces a different output:

loopOver: "row"

Template:

Resulting document:

loopOver: "column"

Template:

Resulting document:

loopOver: "content"

Template:

Resulting document:

loopOver: "paragraph"

Template:

Resulting document: