You need to sign in to do that
Don't have an account?
khushi S 2
Split JSON values and display it in aura component
I am stuck here on how to get json string values into aura components. I am getting result as following
{"results":[{"address_components":[{"long_name":"4700","short_name":"4700","types":["street_number"]},{"long_name":"Kingsway","short_name":"Kingsway","types":["route"]},{"long_name":"Metrotown","short_name":"Metrotown","types":["neighborhood","political"]},{"long_name":"Burnaby","short_name":"Burnaby","types":["locality","political"]},{"long_name":"Metro Vancouver","short_name":"Metro Vancouver","types":["administrative_area_level_2","political"]},{"long_name":"British Columbia","short_name":"BC","types":["administrative_area_level_1","political"]},{"long_name":"Canada","short_name":"CA","types":["country","political"]},{"long_name":"V5H 4M1","short_name":"V5H 4M1","types":["postal_code"]}],"formatted_address":"4700 Kingsway, Burnaby, BC V5H 4M1, Canada","geometry":{"location":{"lat":49.2274147,"lng":-122.9998869},"location_type":"ROOFTOP","viewport":{"northeast":{"lat":49.2287636802915,"lng":-122.9985379197085},"southwest":{"lat":49.2260657197085,"lng":-123.0012358802915}}},"place_id":"ChIJWWlMHFl2hlQR6j8qts-7x8c","plus_code":{"compound_code":"62G2+X2 Burnaby, BC, Canada","global_code":"84XV62G2+X2"},"types":["street_address"]}],"status":"OK"}
I want to get values in separate fields street, city, postalcode, province and coutry OR just one field formatted_address in aura component.
So far I have this, in my controller
action.setCallback(this, function(response) {
var state = response.getState();
if (state === "SUCCESS") {
var res = response.getReturnValue();
helper.hideSpinner(component, event, helper);
var frm = JSON.parse(res);
var parsed = JSON.stringify(frm);
console.log("PARSED: "+ parsed);
component.set("v.returnAddress",parsed);}
My aura component-
<aura:iteration items="{!v.returnAddress}" var="retAdd" indexVar="index">
<h2> {!retAdd}</h2>
</aura:iteration>
Any help would be greatly appreciated
{"results":[{"address_components":[{"long_name":"4700","short_name":"4700","types":["street_number"]},{"long_name":"Kingsway","short_name":"Kingsway","types":["route"]},{"long_name":"Metrotown","short_name":"Metrotown","types":["neighborhood","political"]},{"long_name":"Burnaby","short_name":"Burnaby","types":["locality","political"]},{"long_name":"Metro Vancouver","short_name":"Metro Vancouver","types":["administrative_area_level_2","political"]},{"long_name":"British Columbia","short_name":"BC","types":["administrative_area_level_1","political"]},{"long_name":"Canada","short_name":"CA","types":["country","political"]},{"long_name":"V5H 4M1","short_name":"V5H 4M1","types":["postal_code"]}],"formatted_address":"4700 Kingsway, Burnaby, BC V5H 4M1, Canada","geometry":{"location":{"lat":49.2274147,"lng":-122.9998869},"location_type":"ROOFTOP","viewport":{"northeast":{"lat":49.2287636802915,"lng":-122.9985379197085},"southwest":{"lat":49.2260657197085,"lng":-123.0012358802915}}},"place_id":"ChIJWWlMHFl2hlQR6j8qts-7x8c","plus_code":{"compound_code":"62G2+X2 Burnaby, BC, Canada","global_code":"84XV62G2+X2"},"types":["street_address"]}],"status":"OK"}
I want to get values in separate fields street, city, postalcode, province and coutry OR just one field formatted_address in aura component.
So far I have this, in my controller
action.setCallback(this, function(response) {
var state = response.getState();
if (state === "SUCCESS") {
var res = response.getReturnValue();
helper.hideSpinner(component, event, helper);
var frm = JSON.parse(res);
var parsed = JSON.stringify(frm);
console.log("PARSED: "+ parsed);
component.set("v.returnAddress",parsed);}
My aura component-
<aura:iteration items="{!v.returnAddress}" var="retAdd" indexVar="index">
<h2> {!retAdd}</h2>
</aura:iteration>
Any help would be greatly appreciated
1. create a Apex class to deserialize the Google API return. You can use the code below.
2. Deserialize Google API return in Apex
Same code is below. replace string S with actual return.
3. Manipulate the deserailized data to what you expect and return the value to Aura component helper method. (do not return the raw data to helper method)