CODEWITHSUNDEEP
javascriptjsonangularjs
Rakesh Kumar
Rakesh Kumar

Reputation: 2853

Calling JSON file from Angular Factory is not working

I am new in AngularJS. I was trying to call json file from factory function but it's showing my var customers = []; array is not updating. Please help.

Below is my code.

var demoApp = angular.module("myApp", []);

demoApp.factory('simpleFactory', ['$http', function($http){

    return {

        getCustomer: function(){
            var customers = [];
            return $http.get("http://www.w3schools.com/website/Customers_JSON.php")
            .success(
                function(data){

                    customers = data;
                },
                function(error){
                    console.log(error);
                });
            console.log(customers)
        }

    }

}]);

demoApp.controller("emplyCtrl", function($scope, simpleFactory){
    $scope.customers = simpleFactory.getCustomer();
});

Demo Fiddle

Upvotes: 0

Views: 243

Answers (3)

aarosil
aarosil

Reputation: 4898

use this in your controller: 

demoApp.controller("emplyCtrl", function($scope, simpleFactory){
    simpleFactory.getCustomer().then(function(response){
        $scope.customers = response.data;
    });
});

Since the view (HTML) reads from the controller's $scope, you have to put the data in $scope somewhere in the controller. Setting it in the factory only allows access from within the factory.

Here is the working Fiddle

Hope this helps!

Upvotes: 1

Jedi
Jedi

Reputation: 87

Don't you think that you should put "$" sign before http? I think that the '$http' there should indicate that it is serializable. That is why, the $http should be stated in the parameter section the same way just like you mentioned in the previous string statement.

Additionally, you cannot just use http, since the syntax is to use $ in front of the http. Otherwise, angular dll will not recognize your code.

demoApp.factory('simpleFactory', ['$http', function($http){

var customers = [];

$http.get("json/customers.json")
    .success(function(data){
    customers = data;
});

var factory = {};

factory.getCustomer = function(){
    return customers;
};

return factory;

}]);

Take a look at the example here: http://www.w3schools.com/angular/angular_http.asp

Thank you,

Upvotes: -1

developer10
developer10

Reputation: 1500

Try something like this:

demoApp.factory('simpleFactory', ['$http', function($http){

    return {

        getCustomer: function(){

            return $http.get("json/customers.json").then(
                function(response){
                    var customers = [];
                    customers = response.data;
                },
                function(error){
                    console.log(error);
                });

        }

    }
}]);

Upvotes: 3

Related Questions