Download as txt, pdf, or txt
Download as txt, pdf, or txt
You are on page 1of 3

<apex:page >

<!--
aura:attribute
1. attribute is a pre-defined element under the namespace of aura
2. aura:attribute is used to create an properties for app, interface,
component, or event.
3.Attributes :

a.access :
1. Indicates whether the attribute can be used outside of its own
namespace.
2. Possible values are private ,public ,global
3. public is a default value.

b.name :
1.This will specify the name of the attribute
2.This is a Required.

c. type :
1. This will specify the datatype of the attribut
2. This is Required value.
3. Possible values (Date,DateTime,Decimal,Double,Integer ,Long
,string ,Boolean )
4. methods, components, list,sobject,object

d. defualt :
1. value that should be assingned to the attribue if no values
are assigned to it

e. description :
1.A summary of the attribute and its usage

f. required :
1.Specified wheather attribute value need to be required to run
this component.

Note : naming convention for the attributes will be lower camel

Example :
<aura:attribute name="empName" type="String" default="Satish"
description="employee
name"
required="true" />

Note : attributes are reffered as {!v.attributeName} in the component


Example :1
Component : Component_Attributes_1.cmp
<aura:component >
<aura:attribute name="empName" type="String" />
<aura:attribute name="age" type="Integer" default="30" />
<aura:attribute name="salary" type="Decimal" required="true" />
<aura:attribute name="exp" type="Integer" description="Roundoff the value
in case of decimal" />

======Start============
<br/><br/>
Name :{!v.empName} <br/> <br/>
Age :{!v.age} <br/><br/>
Salary:{!v.salary} <br/><br/>
Exp :{!v.exp}<br/><br/>
</aura:component>

Application : Compoennt_Attributes_App_1.app
<aura:application >
<c:Component_Attributes_1 empName="Sachin" salary="100000" />
<c:Component_Attributes_1 empName="SachinGupta" salary="100000" exp="3"
age="34"/>
</aura:application>

UseCase:1
1. Create a component student with lastName,firstName,phone as attributes
2. invoke the student component in the application

Component : Student.cmp
----------------------------
<aura:component >
<aura:attribute name="lastName" type="String" required="true"/>
<aura:attribute name="firstName" type="String" />
<aura:attribute name="phone" type="String />
Last Name : {! v.lastName} <br/>
FirstName :{!v.firstName} <br />
Phone :{!v.phone}
</aura:component>

Application : Student_Example.app
-------------------------------------
<aura:application >
<c:Student lastName="Myla" firstName="Satish" phone="040-1234" />
</aura:application>

UseCase 2:
1. Create a component productInfo with name ,price,quantity
2. Create a Component shipping_detail with city,state,pincode
3. invoke the productInfo and shipping_Details in the application

Component: ProductInfo.cmp
-----------------------------
<aura:component >
<aura:attribute name="name" type="String" />
<aura:attribute name="price" type="Decimal" />
<aura:attribute name="quantity" type="Integer" />
Name : {!v.name} <br />
Price :{!v.price} <br/>
Quantity:{!v.quantity} <br/>
</aura:component>

Component : Shipping_Details
-----------------------------
<aura:component>
<aura:attribute name="city" type="String" />
<aura:attribute name="state" type="String" />
<aura:attribute name="pincode" type="Integer" />
City : {!v.city} <br/>
State :{!v.state} <br/>
Pincode:{!v.pincode}
</aura:component>

Application: Customer.app
-----------------------------
<aura:appliation >
<c:productInfo name="IPhone" price="50000.00" quantity="2" />
<c:shipping_Details city="Hyd" state="TG" pincode="500012" />
</aura:application>
-->
</apex:page>

You might also like