Accessing Attribute in Controller Lightning Salesforce
You can take help of callback to get the updated value after the Ajax
call:
Helper
userName : function(component, callbackMathod) {
//loading user related data
var action = component.get("c.getUserName");
action.setCallback(this, function(response){
var state = response.getState();
if (state === "SUCCESS") {
component.set("v.Name", response.getReturnValue());
alert('Called in helper: ' + component.get("v.Name"));
if(callbackMathod){
callbackMathod();
}
}
});
$A.enqueueAction(action);
},
Controller
doinit : function(component, event, helper) {
helper.userName(component, function(){
alert('Called in controller: ' + component.get("v.Name"));
});
}
Component
<aura:handler name="init" value="{!this}" action="{!c.doinit}"/>
<aura:attribute name="Name" type="String" />
As mentioned in the comment ,this is happening because in javascript the order of execution is not sequential like apex .
You generally do not need to access anything in your controller as the view is binded to the attribute and you can do further logic in the callback .
userName : function(component) {
//loading user related data
var action = component.get("c.getUserName");
action.setCallback(this, function(response){
var state = response.getState();
if (state === "SUCCESS") {
component.set("v.Name", response.getReturnValue());
//do your logic here .You can create functions or further callbacks or promises
}
});
$A.enqueueAction(action);
}
If you really want to understand the async behaviour.In the controller for some fun you can simply put a timeout function like below
doinit : function(component, event, helper) {
helper.userName(component);
window.setTimeout(
$A.getCallback(function() {
if (component.isValid()) {
alert(component.get("v.Name"));
}
}),1000);
}
Caution : Do not use this timeout method for any business logic .Its just for fun and help you understand how javascript is asynchronous in nature and even though the code block will be sequential the order of execution is not as place your code block .Here is an in depth articles to understand callbacks
Instead provide a callback implementation like below
({
doinit : function(component, event, helper) {
helper.userName(component,function(){
alert(component.get("v.Name"));
});
}
})
({
userName : function(component,callback) {
//loading user related data
var action = component.get("c.getUserName");
action.setCallback(this, function(response){
var state = response.getState();
if (state === "SUCCESS") {
component.set("v.Name", response.getReturnValue());
// alert('$$$' + component.get("v.Name"));
if(callback){
callback();
}
}
});
$A.enqueueAction(action);
}
})