Here are the supported collection type values.
type | Example | Description |
---|---|---|
type[] (Array) | <aura:attribute name="colorPalette" type="String[]" default="['red', 'green', 'blue']" /> | An array of items of a defined type. |
List | <aura:attribute name="colorPalette" type="List" default="['red', 'green', 'blue']" /> | An ordered collection of items. |
Map | <aura:attribute name="sectionLabels" type="Map" default="{ a: 'label1', b: 'label2' }" /> | A collection that maps keys to values. A map can’t contain duplicate keys. Each key can map to at most one value. Defaults to an empty object, {}. Retrieve values by using cmp.get("v.sectionLabels")['a']. |
Set | <aura:attribute name="collection" type="Set" default="['red', 'green', 'blue']" /> | A collection that contains no duplicate elements. The order for set items is not guaranteed. For example, "red,green,blue" might be returned as "blue,green,red". |
To determine a variable type, use typeof or a standard JavaScript method, such as Array.isArray(), instead. The instanceof operator is unreliable due to the potential presence of multiple windows or frames.
There are several ways to set items in a list. To use a client-side controller, create an attribute of type List and set the items using component.set().
This example retrieves a list of numbers from a client-side controller when a button is clicked.
<aura:attribute name="numbers" type="List"/> <lightning:button onclick="{!c.getNumbers}" label="Display Numbers" /> <aura:iteration var="num" items="{!v.numbers}"> {!num.value} </aura:iteration>
/** Client-side Controller **/ ({ getNumbers: function(component, event, helper) { var numbers = []; for (var i = 0; i < 20; i++) { numbers.push({ value: i }); } component.set("v.numbers", numbers); } })
To retrieve list data from a controller, use aura:iteration.
var myMap = cmp.get("v.sectionLabels"); myMap['c'] = 'label3';
for (key in myMap){ //do something }