Menu

repeat

An HTML content command that iterates through all items of a Collection and produces a copy of its host element for every item beyond the first.

The value of its primary attribute should resolve into the Collection to iterate through. For every item in the Collection, aside from the first, a copy of the host element is produced (for the first item,  the host element itself is used). This copy is placed into the document after the host element or the previous copy. Any logic attributes or elements on the copy or within its contents are then evaluated with the current item in the variable context behind the key defined with the repeat-var secondary attribute.

This content command produces a local variable context for the commands evaluated within the iteration rounds. This local context's primary feature is that it contains one of the Collection's items for the other commands to access. A new context is created at the start of every round of the iteration process, and then terminated at the end of the round.

This command has a priority of 100.

Secondary attributes

repeat-var

Required
Value type
EL-evaluated
Yes String
Yes
The resolved value of this attribute defines the name of the local context variable that holds the current item of the loop.
repeat-round-start

Required
Value type
EL-evaluated
No Boolean Yes
This attribute can be used to define a condition for skipping certain iteration rounds. This attribute's expression is evaluated at the start of every round and if it doesn't resolve into true, the current item and loop round is skipped, resulting in no copy of the content being produced.

If undefined, no iteration rounds are skipped.
repeat-var-status

Required
Value type
EL-evaluated
No String
No
Defines the name of the variable that holds a Loop Status value. Loop Status has the properties count, first, last and index. A new value is generated for every iteration of the loop.

Property count is the number of the iteration starting from 1.
Property index is same as count with the difference that it starts from 0.
Property first is a Boolean true during first round of the loop. Note that if round-start causes the first item of the iteration to be skipped, this will never be true.
Property last is a Boolean true during the last round of the loop. Note that if round-start causes the last item of the iteration to be skipped, this will never be true.

Examples

Use repeat to present a Collection's data on a HTML template or Form. Take care to not repeat content that has things within it that should be unique, such as a table's thead element.

<div dyn-repeat="items" repeat-var="item">
  <p dyn-content="item.text"/>
</div>

To create dynamic tables in HTML, place repeat on the table's content row. Additionally, this example table excludes items of its Collection missing the "description" property using the repeat-round-start secondary attribute:

<table>
  <tr dyn-repeat="items" dyn-repeat-var="item" dyn-repeat-round-start="item.description == null">
    <td>
      <p dyn-content="item.name"/>
    </td>
    <td>
      <p dyn-content="item.description"/>
    </td>
  </tr>
</table>  

Should you have a need of repeating more than one table row, place repeat on a tbody element in which the rows are:

<table>
  <tbody dyn-repeat="items" dyn-repeat-var="item">
    <tr>
      <td>
        <p dyn-content="item.name">
      </td>
      <td>
        <p dyn-content="item.type">
      </td>
    </tr>
    <tr>
      <td colspan="2">
        <p dyn-content="item.description">
      </td>
    </tr>
  </tbody>
</table> 

Comments

0 comments