Lightning開発と『Aura.Action』についてです。

親の持つJS処理を子コンポーネントに渡したい場合、type="Aura.Action"で値を受け渡しできます。
<aura:attribute name="onclick" type="Aura.Action" default="{!c.myAction}" description="This allows handling onClick events"/>
button.cmp
<aura:component>
<!-- Attributes for the button -->
<aura:attribute name="label" type="String" description="This is the button label"/>
<aura:attribute name="class" type="String" description="SLDS class"/>
<aura:attribute name="onclick" type="Aura.Action" default="{!c.myAction}" description="This allows handling onClick events"/>
<aura:attribute name="data" type="String" description="Any data to be passed via html5 data- attribute"/>
<!-- Attributes for SVG -->
<aura:attribute name="svgXlinkHref" type="String" description="svgIcon's xlink-href"/>
<aura:attribute name="svgClass" type="String" description="svgIcon CSS classname"/>
<button class="{!v.class}" onclick="{!v.onclick}" data-data="{!v.data}"><c:svg xlinkHref="{!v.svgXlinkHref}" class="{!v.svgClass}" />{!v.label}</button>
</aura:component>
svg.cmp
<aura:component >
<aura:attribute name="class" type="String" description="CSS classname for the SVG element" />
<aura:attribute name="xlinkHref" type="String" description="SLDS icon path. Ex: /assets/icons/utility-sprite/svg/symbols.svg#download" />
<aura:attribute name="ariaHidden" type="String" default="true" description="aria-hidden true or false. defaults to true" />
</aura:component>
svgRenderer.js
({
render: function(component, helper) {
//grab attributes from the component markup
var classname = component.get("v.class");
var xlinkhref = component.get("v.xlinkHref");
var ariaHidden = component.get("v.ariaHidden");
//return an svg element w/ the attributes
var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
svg.setAttribute('class', classname);
svg.setAttribute('aria-hidden', ariaHidden);
svg.innerHTML = '<use xlink:href="'+xlinkhref+'"></use>';
return svg;
}
})
AllAccounts.app
<aura:application>
<div class="slds" style="margin-top:10px;margin-left:10px;">
<ltng:require styles="/resource/SLDS090/assets/styles/salesforce-lightning-design-system-ltng.css" />
<c:button class="slds-button slds-button--neutral"
label="Details"
svgXlinkHref="/resource/SLDS090/assets/icons/standard-sprite/svg/symbols.svg#account"
svgClass="slds-icon slds-icon-text-default"
onclick="{!c.showDetails}"
/>
</div>
</aura:application>
AllAccountsController.js
({
showDetails : function(component, event, helper) {
alert("showing Details")
}
})
