Use <oj-bind-for-each> to bind items of an array to the specified markup section.
The markup section is duplicated for each array item when element is rendered.
<oj-bind-for-each> requires the application to specify a single <template> element
as its direct child. The markup being stamped out should be placed inside of this <template> element.
During iteration, each item will have access to the same binding context that is applied to the
In addition the binding context will contain the following properties:
$current - An object that contains information for the current array item being rendered.
data - The current array item being rendered.
index - Zero-based index of the current array item being rendered.
The index value is not updated in response to array additions and removals and
is only recommended for static arrays.
observableIndex - An observable that refers to the zero-based index of the current array item being rendered.
observableIndex value is updated in response to array additions and removals
and can be used for both static and dynamic arrays.
- alias - If as attribute was specified, the value will be used to provide an
application-named alias for
$current. This can be especially useful
if multiple oj-bind-for-each elements are nested to provide access to the data
for each level of iteration.
Note that the <oj-bind-for-each> element will be removed from the DOM after binding is applied.
For slotting, applications need to wrap the oj-bind-for-each element inside another HTML element (e.g. <span>) with the slot attribute.
The oj-bind-for-each element does not support the slot attribute.
Also note that if the <oj-bind-for-each> element is being used to programmatically build an HTML table,
it must be placed in the view of an oj-module and loaded via ModuleElementUtils.