1

Hi I am new in AngularJS and trying to fetch and show json key data separately to console window. I can able to fetch entire json data , but unable to fetch datas within a particular node. Where am I going wrong ?

Service.js 

app.service("AppService", function($http) {
    return {
       network: [],
       getAllService: function(network){

        return $http({
            method: 'GET',
            url: 'http://99.126.4.6:3200/app/json/allDatas',
            headers: {'Content-Type': 'application/json'} 

        })
                .then(function(data) {
                    return data;
                })
    }
    }
});

Controller :-

app.controller('getController', ['$scope','$http','AppService','$localStorage', function ($scope,$http,AppService,$localStorage) {


            $scope.load = AppService.getAllService();
            $scope.load.then(function(data) {
            $scope.getAllData = data; 
            $scope.getId = data.ID;
            $scope.getName = data.Name;
            $scope.getDescription = data.Description;
            console.log($scope.getId + $scope.getName + $scope.getDescription);
            })

}]);

When I console getAllData I can see entire json response.But unable to fetch inner keys.

JSON response:-

Data
Array(1)
0
:
{$id: "1", ID: 1, Name: "APP", Description: "Something", Segments: Array(3)}
WhoAmI
  • 217
  • 1
  • 2
  • 23

2 Answers2

2

You are mixing the old syntax with a new one: .success vs. .then

.then() returns an Http Promise which wraps your response in an object. To pull out your data, you need to access .data first.

Fix this line from:

.then(function(data) {
  return data;
})

to

.then(function(data) {
  return data.data;
})
Aleksey Solovey
  • 4,153
  • 3
  • 15
  • 34
  • Now I am getting this response in my console. `(22) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}] {$id: "1", ID: 1, Name: "App", Description: "Some description", Segments: Array(3)}` . So does the data get stored on my controller over here `$scope.getId = data.ID; $scope.getName = data.Name; $scope.getDescription = data.Description;` – WhoAmI Apr 09 '18 at 10:22
  • 1
    @WhoAmI I think you are also [store it in an array](https://stackoverflow.com/a/49730593/8495123) (_for whatever reason_), try `data.data[0];` as a workaround – Aleksey Solovey Apr 09 '18 at 10:25
  • Thank you for your help . I am getting the infos . – WhoAmI Apr 09 '18 at 10:28
  • Hey! the array contains many objects and I want to display the whole. [0] will show only the first object. – WhoAmI Apr 10 '18 at 05:52
  • @WhoAmI then use `data.data` and change your other logic to accept the array instead. For example `$scope.getAllData` can be used in `ng-repeat="data in getAlldata"` and then you can pull out the properties with `{{data.ID}}`, etc. (At this point it's beyond the scope of your question, fix it yourself, or ask a new one) – Aleksey Solovey Apr 10 '18 at 08:06
  • Sure , Thanks again – WhoAmI Apr 10 '18 at 09:02
1

data is an array, so access it's value by index

    $scope.load = AppService.getAllService();
    $scope.load.then(function(data) {
    angular.forEach(data, function(value) {
       console.log(value.ID+"   "+value.name++"   "+value.escription);
    });
    })
Ininiv
  • 1,325
  • 7
  • 12
  • Ok , this worked too. Thank You. I want to show every objects contained in the array. – WhoAmI Apr 10 '18 at 07:24
  • Loop the data and console it angular.forEach(data, function(value) { console.log(value.ID+" "+value.name++" "+value.escription); }); – Ininiv Apr 10 '18 at 07:37
  • Throwing errors: `Uncaught SyntaxError: missing ) after argument list` and `[ng:areq] http://errors.angularjs.org/1.3.15/ng/areq?p0=getController&p1=not%20aNaNunction%2C%20got%20undefined` – WhoAmI Apr 10 '18 at 07:55
  • Edited, please check it now – Ininiv Apr 10 '18 at 09:17
  • It's still incorrect. Though I maked the correction. `$scope.load = AppService.getAllService(); $scope.load.then(function(data) { angular.forEach(data, function(value) { $scope.getAllData = data; console.log(value.ID +value.Name + value.Description); }); });` It's working fine for me . Thanks for the help. – WhoAmI Apr 10 '18 at 11:27