aura:iteration

Renders a view of a collection of items. Supports iterations containing components that can be created exclusively on the client-side.

aura:iteration iterates over a collection of items and renders the body of the tag for each item. Data changes in the collection are rerendered automatically on the page. It also supports iterations containing components that are created exclusively on the client-side or components that have server-side dependencies.

This example shows a basic way to use aura:iteration exclusively on the client-side.

<aura:component>

  <aura:iteration items="1,2,3,4,5" var="item">
        <meter value="{!item / 5}"/><br/>
    </aura:iteration>

</aura:component>

Attributes

Attribute Name Attribute Type Description Required?
body ComponentDefRef[] Template to use when creating components for each iteration. Yes
end Integer The index of the collection to stop at (exclusive)
indexVar String The name of variable to use for the index of each item inside the iteration
items List The collection of data to iterate over Yes
loaded Boolean True if the iteration has finished loading the set of templates.
start Integer The index of the collection to start at (inclusive)
template ComponentDefRef[] The template that is used to generate components. By default, this is set from the body markup on first load.
var String The name of the variable to use for each item inside the iteration Yes