AngularJS : factory function undefined in controller

Question

I used to make it work the exact same way before, and it's driving me crazy. I want to perform a $http GET call into a factory and then get back the result into the controller, to be processed.

The factory (don't pay attention to the madness of the request url ):

App.factory('MessageFactory', function ($http) {
        var MessageFactory = {
            getCast: function () {
                var request = {
                    method: "GET",
                    url: spHostUrl + "/_api/web/Lists/getByTitle('" + listTitle + "')/items?$select=AuthorId,Author/Name,Author/Title,Type_x0020_message,Title,Modified,Body,Expires,Attachments&$expand=Author/Id",
                    headers: {
                        "Content-Type": "application/json;odata=verbose",
                        "Accept": "application/json;odata=verbose"
                    }
                };

                $http(request)
                .then(function (res) {
                    return res.data;
                }).catch(function (res) {
                    console.error("error ", res.status, res.data);
                }).finally(function () {
                    console.log("end");
                });
            }
        };
        return MessageFactory;
    });

Now the controller :

App.controller('MessageController', function ($scope, $http, $log, $attrs, MessageFactory) {
        $scope.messages = MessageFactory;
        MessageFactory.getCast().then(function (asyncCastData) {
            $scope.messages.cast = asyncCastData;
        });
        $scope.$watch('messages.cast', function (cast) {
            //do stuff
        });
});

When I test it I get the following error :

Error: MessageFactory.getCast(...) is undefined @/Scripts/App.js:167:9

The line 167 is indeed this line in the controller

MessageFactory.getCast().then(function (asyncCastData) {

My app works fine for any other feature, so my issue appeared when adding this part, and I'm pretty sure my controller doesn't know my factory yet and thus try to access to his function. As it's an asynchronous call, it should work with the code in the controller. I need your help on this, thanks.

you must be getting .then of undefined error..Am right?

Pankaj Parkar
– Pankaj Parkar

2015-06-11 09:49:53 +00:00
Commented Jun 11, 2015 at 9:49 — Pankaj Parkar
– Pankaj Parkar, Commented Jun 11, 2015 at 9:49

Pankaj Parkar · Accepted Answer · 2015-06-11 10:02:36Z

3

You must be getting .then of undefined error

Because you missed to return promise from service method.

Service

var MessageFactory = {
  getCast: function() {
    var request = {
      method: "GET",
      url: spHostUrl + "/_api/web/Lists/getByTitle('" + listTitle + "')/items?$select=AuthorId,Author/Name,Author/Title,Type_x0020_message,Title,Modified,Body,Expires,Attachments&$expand=Author/Id",
      headers: {
        "Content-Type": "application/json;odata=verbose",
        "Accept": "application/json;odata=verbose"
      }
    };

    return $http(request) //returned promise from here
      .then(function(res) {
        return res.data;
      }).catch(function(res) {
        console.error("error ", res.status, res.data);
      }).finally(function() {
        console.log("end");
      });
    }
};

edited Jun 11, 2015 at 10:02

answered Jun 11, 2015 at 9:43

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

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

1 Comment

Alex Over a year ago

thanks a lot I though that returning the data retrivied in the "then" section would be sufficient !

Collectives™ on Stack Overflow

AngularJS : factory function undefined in controller

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related