Can I have multiple functions in my AngularJS Factory?

Question

I'm following the Tutorial from the official AngularJS docs and I want to know if I can add another function to the Phone factory so that I can organize code better. They have declared a "query" function, but what if I wanted to add a query2 function that references a different url...say phones2/:phoneName.json for example?

Factory declaration:

var phonecatServices = angular.module('phonecatServices', ['ngResource']);

phonecatServices.factory('Phone', ['$resource',
  function($resource){
    return $resource('phones/:phoneId.json', {}, {
      query: {method:'GET', params:{phoneId:'phones'}, isArray:true}
    });
  }]);

I have tried a number of things and non of them seem to be working :s

This answer seems to be on the right track, but the syntax for each factory function doesn't quite match up with the above factory.

Something along the lines of:

phonecatServices.factory('Phone', ['$resource',
      function($resource){
       return {
        query: ...
        query2: ...
       }
      }]);

you could provide url in query2 method as : query2 : {method:'GET', url : '/phones2/:phoneName.json', params:{phoneName:'ph1'}, isArray:true}. But I think there is more better way of doing it. This approach appends unwanted ? in the URL. You can give a look and comment on that. — Lekhnath
– Lekhnath, Commented Feb 17, 2014 at 5:15
The accepted answer here worked: stackoverflow.com/questions/17160771/…. — SomethingOn
– SomethingOn, Commented Feb 17, 2014 at 6:42

Community · Accepted Answer · 2017-05-23 12:03:08Z

26

One such example of this is: Link for Demo

angular.module('services', []).factory('factoryName', ["$filter",
  function($filter) {
    var method1Logic = function(args) {
      //code
    };
    var method2Logic = function(args) {
     //code
    };
    return {
      method1: method1Logic,
      method2: method1Logic
    };
  }
]).controller('MainController', ["$scope", "$rootScope", "$filter", "factoryName", function ($scope, $rootScope, $filter,factoryName) {
     $scope.testMethod1 = function(arg){
       $scope.val1 = factoryName.method1(arg);
     };

     $scope.testMethod2 = function(arg){
       $scope.val2 = factoryName.method2(arg);
     };
}]);

There is even a better version Opinionated version of this: References

function AnotherService () {

  var AnotherService = {};

  AnotherService.someValue = '';

  AnotherService.someMethod = function () {

  };

  return AnotherService;
}
angular
  .module('app')
  .factory('AnotherService', AnotherService);

edited May 23, 2017 at 12:03

CommunityBot

11 silver badge

answered Apr 6, 2015 at 8:51

Abhijeet

8,7715 gold badges73 silver badges82 bronze badges

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

4 Comments

SomethingOn Over a year ago

Thanks Abhijeet, I like you method ;)

SomethingOn Over a year ago

This method is much more readable and therefore I changed it to the accepted answer

Hamzeen Hameem Over a year ago

awesome! very useful

rolinger Over a year ago

@Abhijeet - could you, or someone, demonstrate how to sort the results of method1Logic (assuming there is $http content waiting to return) so that the results are sorted BEFORE the results are returned to the controller....or how to sort the results the instance they are returned to the controller. Having a hard time figuring that out.

SomethingOn · Accepted Answer · 2014-02-21 03:08:49Z

14

This is the service code:

myServices.factory('Auth', ['$resource',
  function($resource){
    return {
      Login: $resource(serviceURL + 'login', {}, { go: { method:'POST', isArray: false }}),
      Logout: $resource(serviceURL + 'logout', {}, { go: { method:'POST', isArray: false }}),
      Register: $resource(serviceURL + 'register', {}, { go: { method:'POST', isArray: false }}),
    };
  }
]);

And from my controller I just have to add the go() function call to make it work:

Auth.Login.go({ username: $scope.username, password: $scope.password },

I guess I could have named the go function after the method and called it "post()" instead for clarity...

answered Feb 21, 2014 at 3:08

SomethingOn

11.1k18 gold badges72 silver badges108 bronze badges

2 Comments

brianlmerritt Over a year ago

Is there a reason you added go ? Is there a function called "go" somewhere? Or could it be removed, and just use Auth.Login({etc})?

SomethingOn Over a year ago

I'll check @brianlmerritt

Kishor Pawar · Accepted Answer · 2021-04-29 11:18:57Z

0

Yes, Of course, you can have multiple functions in an object. The only caveat is your service should return an object. You can have all the valid javascript members in that object as long as you follow object's syntax.

So following is possible

phonecatServices.factory('Phone', ['$resource',
  function($resource){
      return {
            query: ... , // NOTICE THE COMMA HERE 
            query2: ...
       }
}]);

You must be missing the comma (,) to separate your object's key values.

answered Apr 29, 2021 at 11:18

Kishor Pawar

3,5463 gold badges34 silver badges64 bronze badges

Collectives™ on Stack Overflow

Can I have multiple functions in my AngularJS Factory?

3 Answers 3

4 Comments

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related