How to get data from controller to Factory in angularjs

Question

I am newbie to Angularjs World. I want to fetch some data from angularjs controller to Angularjs Factory.Controller and factory are defined in different js files.

code from Factory(File name Application.js)

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

 app.factory('autoCompleteDataService', [function(MyController) {
    return {
       getSource: function() {
        return  MyController.getFirstName();

      }
   }

}]);

 app.directive('autoComplete', function(autoCompleteDataService) {
    return {
       restrict: 'A',
        link: function(scope, elem, attr, ctrl) {
        $(elem).autocompleteArray(autoCompleteDataService.getSource(), {
        minLength: 2
      });
     }

  }})

Controller code (File Name Controller.js)

  function  MyController($scope){
    this.getFirstName= function ()
  {
      var arrayFName=[];
      for(var k=0;k< $scope.MyData.length;k++)
          {
            arrayFName.push($scope.MyData[k].fname);
          }
     return arrayFName;
  }

MyData is array containing some hard coded value for 'fname'

When i ran this code got error 'Error: MyController is undefined'. Is it possible to fetch data from controller if yes then how?

You don't want to fetch data from a controller, you want to fetch data from the service to the controller. Also you should define your controller on the Angular module: app.controller('myController',['$scope',function($scope){ ... }]) — m.e.conroy
– m.e.conroy, Commented Mar 25, 2014 at 12:59

Tom · Accepted Answer · 2014-03-25 13:11:16Z

1

You should have source, or firstName, defined in the factory, and then set it from the controller. It will then be accessible from other controllers which use the factory.

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

app.factory('autoCompleteDataService', [function () {
    var _source;
    return {
        getSource: function () {
            return _source;
        },
        setSource: function (source) {
            _source = source;
        }
    }
}]);

And then subsequent controllers might be like:

app.controller('someController', ['$scope', 'autoCompleteDataService',
    function ($scope, autoCompleteDataService) {
        $scope.source = autoCompleteDataService.getSource();

        // or even...
        // $scope.getFirstName = autoCompleteDataService.getSource;
    }]);

edited Mar 25, 2014 at 13:11

answered Mar 25, 2014 at 12:57

Tom

7,7401 gold badge26 silver badges49 bronze badges

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

2 Comments

Tom Over a year ago

The way you're set up, you're trying to call getSource in your service, which in turn calls getFirstName from your controller. What you should do, in that controller, is setSource() (or setFirstName, which would make more sense). Now, any subsequent requests won't call to the controller (MyController.getFirstName()) but to the service (autoCompleteDataService.getSource())

Tom Over a year ago

...what's not working? Did you make a setSource function, and call it from the controller, so that _source is set to the object you want to get in autoCompleteDataService?

Collectives™ on Stack Overflow

How to get data from controller to Factory in angularjs

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related