0

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. enter image description here

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.

Community
  • 1
  • 1
Mithun Sen
  • 523
  • 5
  • 19
  • possible duplicate of [How to return the response from an asynchronous call?](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call) – Bimper Apr 24 '15 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 Apr 24 '15 at 11:26
  • maybe the $http call is working after i got my response.. – Mithun Sen Apr 24 '15 at 11:36
  • @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 Apr 24 '15 at 11:46
  • 1
    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 Apr 24 '15 at 11:48
  • @charlietfl, Thanks, as your suggestion I added promise and it is working now.. – Mithun Sen Apr 24 '15 at 12:19

1 Answers1

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.

Mithun Sen
  • 523
  • 5
  • 19