コレクション型

次に、サポートされているコレクション型の値を示します。

型	例	説明
`List`	`<aura:attribute name="colorPalette" type="List" default="red,green,blue" />`	順序付けされた項目のコレクション。
`Map`	`<aura:attribute name="sectionLabels" type="Map" default="{ a: 'label1', b: 'label2' }" />`	キーを値に対応付けるコレクション。対応付けに重複キーを含めることはできません。各キーを複数の値に対応付けることはできません。デフォルトは空のオブジェクト `{}` です。値を取得するには、`cmp.get("v.sectionLabels")['a']` を使用します。
`Set`	`<aura:attribute name="collection" type="Set" default="1,2,3" />`	重複する要素を含まないコレクション。セット項目の順序は保証されません。たとえば、`"1,2,3"` が `"3,2,1"` と返される可能性があります。

リスト項目の設定

リスト内の項目を設定するには、いくつかの方法があります。クライアント側のコントローラを使用するには、List 型の属性を作成し、component.set() を使用して項目を設定します。

次の例では、ボタンをクリックしたときにクライアント側のコントローラから数値のリストを取得します。

1swfobject.registerObject("clippy.codeblock-0", "9");<aura:attribute name="numbers" type="List"/>
2<ui:button press="{!c.getNumbers}" label="Display Numbers" />
3<aura:iteration var="num" items="{!v.numbers}">
4  {!num.value}
5</aura:iteration>
6

1swfobject.registerObject("clippy.codeblock-1", "9");/** Client-side Controller **/
2({
3  getNumbers: function(component, event, helper) {
4    var numbers = [];
5    for (var i = 0; i < 20; i++) {
6      numbers.push({
7        value: i
8      });
9    }
10    component.set("v.numbers", numbers); 
11    }
12})
13

リストデータをコントローラから取得するには、aura:iteration を使用できます。詳細は、aura:iterationを参照してください。

対応付け項目の設定

キーと値のペアを対応付けに追加するには、構文 myMap['myNewKey'] = myNewValue を使用します。

1swfobject.registerObject("clippy.codeblock-2", "9"); var myMap = cmp.get("v.sectionLabels");
2 myMap['c'] = 'label3';

次の例では、対応付けからデータを取得します。

1swfobject.registerObject("clippy.codeblock-3", "9");for (key in myMap){
2     //do something
3}
4

Lightning コンポーネント開発者ガイド

No Results

リスト項目の設定

対応付け項目の設定