AngularJS Factory undefined is not a function

Question

I am trying to load data from my JSON file through a $http call in my Factory and every time I run the code I get the same error. How can I fix this.

Error

TypeError: undefined is not a function
at Object.getFruitsData (http://localhost/test/JSON/js/controllers.js:12:18)
at new <anonymous> (http://localhost/test/JSON/js/controllers.js:3:16)
at invoke (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js:3869:17)
at Object.instantiate (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js:3880:23)
at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js:7134:28
at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js:6538:34
at forEach (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js:330:20)
at nodeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js:6525:11)
at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js:5986:15)
at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js:5989:13)

the code is which I am using is down below.

fruitsFactory.js

app.factory('fruitsData', function($http, $log){
    return{
        getFruitsData: function(succescb){
            $http({method:'GET', url:'json/testList.json'})
                .succes(function(data){
                succescb(data);
            })
            .error(function(data){
                $log.warn(data);    
            });     
       }
   };    
});

controller.js

app.controller('fruitsController',['$scope','fruitsData', function($scope, fruitsData){
    fruitsData.getFruitsData(function(fruits){
        $scope.fruits = fruits;
    });
}]);

it's all about async: http://stackoverflow.com/questions/16286605/initialize-angularjs-service-with-asynchronous-data — Eduard Gamonal, Apr 28 '14 at 09:51
The error in this particular case is unrelated to async calls — Tim, Apr 28 '14 at 10:01
It's not about async...it's all about a typo just like what Dieter Goetelen said. You're trying to invoke a non existant method called succes(arg) instead of calling success(arg). — António Sérgio Simões, Apr 28 '14 at 10:03
Yes It is about the typo. So I am able to retrieve data from the JSON file, but the question now is how can I retrieve the data from a database? I got a MySQL database and I have a PHP file to fetch the data and to encode it to JSON. But what do I do with it after that? — Mike, Apr 28 '14 at 10:51
I got the data from my MySQL database, but still get an SyntaxError: Unexpected token {. Is it because of my php file? it returns something like this: {"0":"1","id":"1","1":"John","name":"John","2":"Doe","lastName":"Doe","3":"22","age":"22"} is it because of the return that starts with a {? — Mike, Apr 28 '14 at 13:24

score 2 · Answer 1 · answered Jun 02 '14 at 15:59

you are never returning the data and you are creating a new function to pass into the factory function (mistake?)

try this:

app.factory('fruitsData', ['$http', '$log', function($http, $log) {
  return {
    getFruitsData: function() {
      .success(function(fruitData) {
        return fruitData;
      })
      .error(function(errorMessage) {
        //log the error message
      });
    }
  }
}]);

app.controller('fruitController', ['$scope', 'fruitsData', function($scope, fruitsData) {
  fruitsData.getFruitsData().then(function(data) {
    $scope.fruits = data;
  });
}]);

AngularJS Factory undefined is not a function

Error

fruitsFactory.js

controller.js

1 Answers1