Data Iterator: move through loaded records
Expose one record at a time and move by its position in an array.
Expose one record at a time and move by its position in an array.
Before you begin
Section titled “Before you begin”- An App Connect page with the matching extension included and a known array of record objects.
Use positions for sequential browsing
Section titled “Use positions for sequential browsing”Data Iterator is useful for a next/previous record preview. It operates only on the loaded array; it is not server pagination and cannot retrieve records absent from that array.
Configure Data Source, Start Index and Loop
Section titled “Configure Data Source, Start Index and Loop”ID is the binding name, for example productIterator. Data Source must be an array. Start Index defaults to 0, the first item. Loop controls what happens when moving beyond an end: wrap to the other end when true, otherwise remain at the nearest end.
Choose how to move
Section titled “Choose how to move”First and Last select the ends. Previous and Next move one position. Random chooses a position and may choose the current item again. Select accepts a zero-based Index; pass a finite integer, not a record key.
| Control or value | Meaning and use |
|---|---|
| index | Current zero-based position; -1 for an empty array. |
| value | Current record or primitive value. For objects, bind productIterator.value.name. |
| has.first / has.prev / has.next / has.last | Whether there is a position in that direction without wrapping. These flags stay false at the ends even when Loop permits a wrap. Do not disable a looping Next button solely because has.next is false. |
Example: browse two products
Section titled “Example: browse two products”Use [{id:1,name:‘Notebook’},{id:2,name:‘Pencil’}] with Start Index 0. Bind productIterator.value.name. Next shows Pencil; Next again stays there with Loop off, or shows Notebook with Loop on. Select 1 chooses Pencil regardless of the record’s id.
Handle a changing or empty source
Section titled “Handle a changing or empty source”Replacing Data Source reapplies the configured Start Index. An empty array clears the selection. In the installed implementation a null source can leave the previous displayed value because its update path skips selection; use [] for an explicitly empty result and verify your empty state.
Use a complete page example
Section titled “Use a complete page example”Continue with the matching workflow to connect this component to the surrounding page.
Check your result
Section titled “Check your result”You can configure the component, use its exact output shape and verify selection, filtering or local editing with known example records.