$http request is not returning response from a service in angular js

Question

In my MEAN Stack application when I want to return a static response from a service, I can get the result on controller, and when I want my response with a $http request its not returning the valid data.

Here is my service page-

'use strict';
angular.module('products').factory('ProductSharedService', function($rootScope, $http) {
    var sharedService = {
        getProductList: function (theScope) {
            // Working 
            theScope.productList = {'testkey':'testvalue', 'demokey':'demovalue'};

            // Not working           
            $http.get('/products').then(function(response) {
                theScope.productList = response;
            });
        }
    };

    return sharedService;
});

And here is the controller page -

'use strict';

angular.module('core').controller('InviteController', ['$scope', 'ProductSharedService', '$stateParams', 'Authentication', '$http',
function($scope, ProductSharedService, $stateParams, Authentication, $http) {

$scope.getMembers = function() {
    $scope.productList = {};
    ProductSharedService.getProductList($scope);    //  Get all product from "ProductSharedService" service

    console.log(JSON.stringify($scope.productList));
    console.log($scope.productList);
};

Here is the result with static data. You can see the returned object. enter image description here

And the result with $http request. Now there is nothing.

The $http request will give me the following, if I place it on controller -

{ "_id" : ObjectId("5537cdef3c3a11cd3baa90f8"), "artist" : "test artistname", "title" : "test title", "dimensions" : "140x145", "medium" : "test medium", "price" : 140, "provenance" : "test"}

I have looked at the other questions like this one related to mine, but those did not help me with the current problem.

possible duplicate of How to return the response from an asynchronous call? — Bimper
– Bimper, Commented Apr 24, 2015 at 11:24
you are claiming that the route /products does not work, but you are looking at the results of a request made to /modules — srayner
– srayner, Commented Apr 24, 2015 at 11:26
@Bimper, this question is related to MEAN js, maybe I need help with the $q (promise) or $on or $broadcast ... but I did not find any helpful answer which solved my case. — Mithun Sen
– Mithun Sen, Commented Apr 24, 2015 at 11:46
No you need to log your data within promise callback but since you never return anything from service you should consider rewriting service. Passing scope as argument is backwards... try passing a callback instead, or most would return the $http promise. Study some tutorials — charlietfl
– charlietfl, Commented Apr 24, 2015 at 11:48

Mithun Sen · Accepted Answer · 2015-04-24 13:20:09Z

1

I am answering my own question just to help others to know which I did or suggested to do.

Service file changes -

'use strict';

angular.module('products').service('ProductSharedService', function($http) {
    this.getProductList = function(){
        return $http.get('/products');
    };
});

Controller file changes -

angular.module('core').controller('InviteController', ['$scope', 'ProductSharedService', '$stateParams', 'Authentication', '$http',
    function($scope, ProductSharedService, $stateParams, Authentication, $http) {
        $scope.getMembers = function() {
            var promise = ProductSharedService.getProductList();
            promise.then(function(data) {
                $scope.productList = data;
                console.log(JSON.stringify($scope.productList));
                console.log($scope.productList);
            });
        };
    }
]);

I found the above changes helped me in my case.

edited Apr 24, 2015 at 13:20

answered Apr 24, 2015 at 12:45

Mithun Sen

5235 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

charlietfl Over a year ago

You don't need $q for this .... $http already returns a promise, just return $http from service

Collectives™ on Stack Overflow

$http request is not returning response from a service in angular js

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related