Having some issues with my initial AngularJS project. I am utilizing a yeoman generator and trying to fetch data from a JSON file to check the length of an array containing objects.
This is contents of my data.json file:
{"persons":[
{
"firstname":"Christian",
"lastname":"Bower",
"age":21
},
{
"firstname":"Anthony",
"lastname":"Martial",
"age":25
}
]}
Here's a snippet from my angular controller:
'use strict';
/**
* @ngdoc function
* @name webdevApp.controller:DataTableCtrl
* @description
* # DataTableCtrl
* Controller of the webdevApp
*/
angular.module('webdevApp')
.controller('DataTableCtrl', function ($scope, $http) {
this.awesomeThings = [
'HTML5 Boilerplate',
'AngularJS',
'Karma'
];
$http.get('../data.json').success(function(data){
$scope.Data = data;
$scope.namePerson = $scope.Data.persons[0].firstname;
});
console.log($scope.namePerson);
console.log($scope.Data.length);
});
Console output:
1) undefined
2) TypeError: Cannot read property 'length' of undefined
at new
The next issue - How can I achieve the desired effect shown below (array with objects)?
$scope.persons = [
{
"firstname": "christian",
"lastname": "bower",
"age": 21
},
{
"firstname": "anthony1",
"lastname": "martial",
"age": 25
}];