having troubles with promises angularjs...console log not working with an http request

Question

I'm having troubles making an http request in angular js. I know the call is being made because I can see the response in firebug which is,

 [{"cube":"1" ,"points":"160"},{"cube":"2","points":"690"},{"cube":"3","points":"331"}]

I am going off this tutorial, link.

Thus my code looks like this.
Note I put in comments where I'm having troubles. My main question is why isn't the console.log working? How can I get it to work? How can I have $scope.usersPerCube assigned to the json that is being returned by the network request?

var myApp = angular.module('test', []);

myApp.controller('UserCtrl', function($scope, users) {
   users.getUsers().then(function(data) {
       //not working
       $scope.usersPerCube = data;
       //this isn't getting logged
       console.log(data);
   });
   //this is getting logged and returning [object Object] which is the promise
   console.log(users.getUsers());
})

myApp.factory('users', function($http) {
   return {
     getUsers: function() {
       var url = "http://localhost/index.php/analytics/UsersPerCube"
       return $http.jsonp(url).then(function(result) {
           //this is not getting logged as well...
           console.log(result+ "logging from http");
           return result.data;
       });
     }
   }
});

What do you mean by 'console.log is not working'? Are you seeing 'undefined' or is it never getting called? — Jason Goemaat, Nov 11 '13 at 19:15

score 0 · Accepted Answer · edited May 23 '17 at 11:58

Do you need to use the JSONP method? Please see the following question regarding the use of $http.jsonp parsing JSONP $http.jsonp() response in angular.js.

If you change the $http method to get it logs the data and successfully sets to the scope variable.

Plunker

var myApp = angular.module('test', []);
myApp.controller('UserCtrl', function($scope, users) {
   users.getUsers().then(function(data) {
       //not working
       $scope.usersPerCube = data;
       //this isn't getting logged
       console.log($scope.usersPerCube);
   });
   //this is getting logged and returning [object Object] which is the promise

});

 myApp.factory('users', function($http) {
    return {
      getUsers: function() {
        var url = "data.json?callback=jsonp_callback"
          return $http.get(url).then(function(result) {
          //this is not getting logged as well...
          console.log(result);
          return result.data;
        }, function(result){
          console.log("failed");
        });
     }
   }
 });

this answers all my questions listed above. I am trying to use the JSONP method. The callback with should be url?callback=JSON_CALLBACK and not var url = "data.json?callback=jsonp_callback" — raging_subs, Nov 11 '13 at 20:37

having troubles with promises angularjs...console log not working with an http request

1 Answers1