Uncaught SyntaxError, Unexpected Identifier in for loop in jade - json

Question

I am trying to render a jade with some dynamic content. I am reading from a json in jade.
My json looks like this
{ data1: 'data1',
data2: 'data2',
data3:
[ { name: 'ABC',
address: 'India'
},
{ name: 'DEF',
address: 'Australia'
}]}
I am trying to render a jade and use the data from above json
my jade looks like
var data1 = #{data1};
var data2 = #{data2};
var size = #{data3.length};
for data in #{data3}
var name = data.name;
var address = data.address;
I am able to correctly extract data in the first 3 lines mentioned above. But when I try to fetch data from within a loop, I get "Uncaught SyntaXError, Unexpected Identifier" error while debugging.
If i put a line outisde the for loop, it works fine. Ex
var name = #{data3[0].name};
is rendered properly. But i need to iterate over a loop and fetch data over there. Can somebody help.
Thanks
Updating with more information
1. I have node server running where I create a json -
var json_string = "{"data1":"data1","data2":"data2","data3":[{"name":"ABC","address":"India"},{"name":"DEF","address":"Australia"}]};";
var json_data = JSON.parse(json_string);
console.log(json_data);
res.render('sample_example', json_data);
In my sample_example.jade I have the following snippet within script
var data1 = #{data1};
var data2 = #{data2};
var size = #{data3.length};
for data in #{data3}
var name = data.name;
var address = data.address;
As stated earlier, I am able to properly extract #{data1}, #{data2}, #{data3.length} to the variables . But it breaks within the for loop. In fact, I am able to extract #{data3[0].name} from outside the for loop. But within the for looop it gives the stated error.

Answer 1

This is how you can do it now.
In your server-side you have to JSON.stringify the array of objects.
var json_data = JSON.parse(json_string);
// Convert back to json only the property data3
json_data.data3 = JSON.stringify(json_data.data3);
res.render('simple', json_data);
Or the better is to not parse the JSON just let it go the way it is:
// var json_data = JSON.parse(json_string);
res.render('simple', {
json_data: json_string
});
And in the Jade Template (If you followed the better method):
script(type='text/javascript').
var json_data = !{json_data};
var data1 = json_data.data1;
var data2 = json_data.data2;
var data3 = json_data.data3;
var size = data3.length;
data3.forEach(function(data) {
var name = data.name;
var address = data.address;
console.log(name, address);
});
Also you need to change the loop structure. The for..in used to iterate over objects not array of objects.

Answer 2

This works for me;
- var cdata = {"data1":"data1","data2":"data2","data3":[{"name":"ABC","address":"India"},{"name":"DEF","address":"Australia"}]};
each data in cdata.data3
- var name = data.name;
- var address = data.address;
p Name: #{name}
p Address: #{address}
Can you share the actual jade file contents if updating the code as shown above doesn't work. Also what version of jade and express?