Newer Version Available

This content describes an older version of this product. View Latest

Setting Attributes on a Super Component

Use the <aura:set> system tag to set the value of an attribute in a super component if you are extending a component or implementing an interface.

Every component inherits the body attribute from <aura:component> so body has some special behavior with <aura:set>.

As well as the body attribute, you can use <aura:set> with other inherited attributes.

Let's look at an example. Here is the auradocs:sampleSetTagBase component.

Component source

1swfobject.registerObject("clippy.codeblock-0", "9");<aura:component extensible="true">
2    <aura:attribute name="address1" type="String" />
3    
4    sampleSetTagBase address1: {!v.address1}<br/>
5    
6    sampleSetTagBase body: {!v.body}
7</aura:component>
8
9

The address1 and body attributes don't return any values yet as they haven't been set.

Here is the auradocs:sampleSetTagEx component that extends auradocs:sampleSetTagBase.

Component source

1swfobject.registerObject("clippy.codeblock-1", "9");<aura:component extends="auradocs:sampleSetTagBase">
2    <aura:set attribute="address1" value="808 State St" />
3    
4    sampleSetTagEx address1: {!v.address1}
5</aura:component>
6
7

sampleSetTagEx sets a value for the address1 attribute in the super component, sampleSetTagBase. Note that the {!v.address1} expression in auradocs:sampleSetTagEx outputs an empty value as aura:set set the value in sampleSetTagBase. The address1 attribute has a different value at each level of inheritance.

This usage of <aura:set> works for components and abstract components, but it doesn’t work for interfaces. See Setting Attributes Inherited from an Interface for more information.

Warning

If you are using a component by making a reference to it in your component, you can set the attribute value directly in the markup. For example, here is a component that makes a reference to sampleSetTagEx and sets the address1 attribute directly without using aura:set.

Component source

1swfobject.registerObject("clippy.codeblock-2", "9");<aura:component>    
2    <auradocs:sampleSetTagEx address1="1 Sesame St" />
3</aura:component>
4
5

This component renders the following output:

1swfobject.registerObject("clippy.codeblock-3", "9");sampleSetTagBase address1: 808 State St
2sampleSetTagBase body: sampleSetTagEx address1: 1 Sesame St
3