Lightning Aura Components Developer Guide
jNote: This release is in preview. Features described here don’t become generally available until the latest general availability date that Salesforce announces for this release. Before then, and where features are noted as beta, pilot, or developer preview, we can’t guarantee general availability within any particular time frame or at all. Make your purchase decisions only on the basis of generally available products and features.
Reference Flow Output Variable Values in a Wrapper Aura Component
When you embed a flow in an Aura component, you can display or reference the
flow’s variable values. Use the onstatuschange
action to get values from the flow's output variables. Output variables are returned
as an array.
Example
This example uses the JavaScript controller to pass the flow's accountName and numberOfEmployees variables into attributes on the component. Then, the component displays those values in output components.
1<aura:component>
2 <aura:attribute name="accountName" type="String" />
3 <aura:attribute name="numberOfEmployees" type="Decimal" />
4
5 <p><lightning:formattedText value="{!v.accountName}" /></p>
6 <p><lightning:formattedNumber style="decimal" value="{!v.numberOfEmployees}" /></p>
7
8 <aura:handler name="init" value="{!this}" action="{!c.init}"/>
9 <lightning:flow aura:id="flowData" onstatuschange="{!c.handleStatusChange}" />
10</aura:component>1({
2 init : function (component) {
3 // Find the component whose aura:id is "flowData"
4 var flow = component.find("flowData");
5 // In that component, start your flow. Reference the flow's API Name.
6 flow.startFlow("myFlow");
7 },
8
9 handleStatusChange : function (component, event) {
10 if(event.getParam("status") === "FINISHED") {
11 // Get the output variables and iterate over them
12 var outputVariables = event.getParam("outputVariables");
13 var outputVar;
14 for(var i = 0; i < outputVariables.length; i++) {
15 outputVar = outputVariables[i];
16 // Pass the values to the component's attributes
17 if(outputVar.name === "accountName") {
18 component.set("v.accountName", outputVar.value);
19 } else {
20 component.set("v.numberOfEmployees", outputVar.value);
21 }
22 }
23 }
24 },
25})