SFDC：Lightningアプリ開発『Local IDs』と『Global IDs』

Lightning Componentsには『Local IDs』と『Global IDs』の二種類のIDが宣言できるようになっています。

Local IDsの宣言はこんな感じです。『aura:id=』というように宣言します。

<ui:button aura:id="button1" label="button1"/>

Global IDsの宣言はこんな感じです。『id=』というように宣言します。

<div id="{!globalId + '_footer'}"></div>

次のように宣言して確認してみました。

<ui:InputText aura:Id="expname" class="form-control" value="{!v.newExpense.name}" placeholder="Local IDs" required="true" />
<input type="text" id="{!globalId + '_input'}" class="form-control" placeholder="Global IDs" />

HTMLに変換された結果はこのようになります。

divタグは指定したIDのままでしたが、TextBoxのIDはLocalもGlobalも自動生成された値が設定されていました。Visualforceのときのようにdocument.getElementByIdでIDを指定するという使い方はしないみたいです。

Global IDの方ですが『9:2.a_input』となっていました。『id="{!globalId + '_input'}"』と宣言していたので『'_input'』と文字列で指定したものはそのまま設定されglobalIdと変数で指定したものは『9:2.a』というように設定されました。おそらく各コンポーネント毎に自動生成された値だと思います。

追加で確認してみました。やはりglobalIdの部分は共通で設定されるみたいです。

ちなみに『aura:component』タグや『ui:InputText』タグのようにLightning用のタグはGlobal IDsを設定できないみたいです。

最後に処理内での呼び出し方は次のようになるみたいです。

Local IDs

cmp.find("button1"),

Global IDs

var globalId = cmp.getGlobalId();
var comp = $A.getCmp(globalId);

まだ理解できていないことが多いですがLightningのIDはこのような感じになっていました。『Local IDs』と『Global IDs』についてはLightning Components Developers Guideに記載されています。