CODEWITHSUNDEEP
angularjsjson
GerryofTrivia
GerryofTrivia

Reputation: 430

error when try to get data from json angular

i try to get the data json from factory. i got nothing from the json and i try to look on my console and i got this

angular.min.js:123 Possibly unhandled rejection: {"data":null,"status":-1,"config":{"method":"GET","transformRequest":[null],"transformResponse":[null],"jsonpCallbackParam":"callback","url":"https://api.myjson.com/bins/d5nyl","headers":{"Accept":"application/json, text/plain, */*"}},"statusText":""}

please enlighten me for this kind of error

experience.html

  <tr ng-repeat="experience in experiences" class="">
      <td><p>{{experience.no}}</p></td>
      <td><p>{{experience.name}}</p></td>
    </tr>

(Controller)

angular.module('app').controller('experienceCtrl',['$scope','Experiences',function($scope,Experiences){
$scope.experiences= Experiences.get();
}]);

(SERVICES) experience.js

angular.module('app').factory('Experiences',['$http', function($http){
      return{
        get: function(){
          return $http.get('https://api.myjson.com/bins/d5nyl').then(function(response){
            return response.data;
          });
        }
      };
    }])

Upvotes: 0

Views: 1169

Answers (1)

AndrewR
AndrewR

Reputation: 6748

In your code, $scope.experiences is the promise object and return response.data; is returning to nothing. You need to use the promise object in your controller to assign the data.

angular.module('app')
.controller('experienceCtrl',
    ['$scope','Experiences',function($scope,Experiences){

    Experiences.get()
    .then(function(response) { $scope.experiences = response.data; });
}]);

angular.module('app').factory('Experiences',['$http', function($http){
    return {
        get: function(){
          return $http.get('https://api.myjson.com/bins/d5nyl');
        }
    }
}]);

Upvotes: 2

Related Questions