tyoshikawa1106のブログ

- Force.com Developer Blog -

SFDC:Lightningアプリ開発『aura:iteration』タグの使い方

Dreamforce2014のDeveloper KeynoteでLightningアプリのライブコーディングがあったのですが、その中で『aura:iteration』タグの使い方についての説明がありました。


『aura:iteration』はリスト件数分の繰り返し処理を実行できるタグです。今までのVisualforce開発で使用していた『apex:repeat』と同じことができます。『apex:repeat』ではvalue=""で対象のリストを指定しましたが、『aura:iteration』では『items=""』というように指定します。


サンプルコードです。

<ul >
    <aura:iteration items="{!v.contacts}" var="c">
        <li class="contactInfo">
            <div class="theheading">
                <li>
                    <img src="{!c.PhotoUrl}" />
                    <h3>{!c.Name}</h3>
                    <h2>{!c.Title}</h2>
                </li>
            </div>
            <p>{!c.Phone}</p>
            <p>{!c.Email}</p>
        </li>
    </aura:iteration>
</ul>


例えば次のような画面を表示したいときに利用できます。

f:id:tyoshikawa1106:20141025211723p:plain


Developer Keynoteの動画はYoutubeで日本語通訳付きで公開されています。