Accessing elements in JSON file - json

Question

I am attempting to use a simple $http.get to a .JSON file, which seems to be found, but when trying to pass the data to the front end, i am seeing an error in my console:
Error: data.unitedkindgom: is undefined
Here's my controller:
app.controller("CityController", function($scope, $http, cityService) {
$scope.UKCities = [];
cityService.getCityData(function(data) {
$scope.UKCities = data.unitedkindgom.CityInfo;
console.log(data.unitedkindgom.CityInfo);
});
My JSON:
unitedkindgom: {
"NoCities": 66,
"Balance": 2103,
"Population": 63705000,
"CityInfo": [
{
"CityName": "London",
"CityPopulation": "7825200",
"Facts": {
"SubFact1": "xzy",
"SubFact2": "xzy",
"SubFact3": "xzy",
"SubFact4": "xzy",
"SubFact5": "xzy"
},
},
{
"CityName": "Manchester",
"CityPopulation": "2584241",
"Facts": {
"SubFact1": "abc",
"SubFact2": "abc",
"SubFact3": "abc",
"SubFact4": "abc"
},
}
],
"SubmitInfo": null,
"FormAction": null,
"FormController": null,
}
Thanks
UPDATE
cityService.getCityData
app.factory('cityService', function($http) {
return {
getCityData: function(done) {
$http.get('/data/city.json')
.success(function(data) { done(data);})
.error(function(error) {
alert('An error has occured');
});
}
}
});
UPDATE
If i remove $scope.UKCities = data.unitedkindgom.CityInfo; and replace console.log(data.unitedkindgom.CityInfo); with console.log(data); I can see all my data in the console window.
If replace console.log(data.unitedkindgom.CityInfo); with console.log(data.unitedkindgom); I see Undefined in the console window.

Answer 1

Using JSONLint, I found out that your JSON is invalid, so it can't be parsed
Below is a valid JSON of your data
{
"unitedkindgom": {
"NoCities": 66,
"Balance": 2103,
"Population": 63705000,
"CityInfo": [
{
"CityName": "London",
"CityPopulation": "7825200",
"Facts": {
"SubFact1": "xzy",
"SubFact2": "xzy",
"SubFact3": "xzy",
"SubFact4": "xzy",
"SubFact5": "xzy"
}
},
{
"CityName": "Manchester",
"CityPopulation": "2584241",
"Facts": {
"SubFact1": "abc",
"SubFact2": "abc",
"SubFact3": "abc",
"SubFact4": "abc"
}
}
],
"SubmitInfo": null,
"FormAction": null,
"FormController": null
}
}
Note that its entirely wrapped in { }, unitedkindgom is wrapped in " " and here and there some excess , are removed.