CODEWITHSUNDEEP
javascriptangularjsweb-applications
Sean Geoffrey Pietz
Sean Geoffrey Pietz

Reputation: 1140

Angular: Adding factory methods on module from within run() function

I have an angular module with a factory that returns a resource based on inputs from a constant on that same module.

like so:

angular.module('resources', [])
    .constant('resourceMap', { 
        resource1: { ... },
        resource2: { ... },
        resource3: { ... },
        ...
    })
    .factory('resourcebuilder', function($resource) {
        return {
            build: function(resourceData) {
                return $resource(resourceData);
            }
        };
    });

I then can create factories that return those resources like so:

angular.module('resources')
    .factory("resource1" function(resourceMap, resourceBuilder) {
        return resourceBuilder.build(resourceMap["resource1"]);
    })
    .factory("resource2" function(resourceMap, resourceBuilder) {
        return resourceBuilder.build(resourceMap["resource2"]);
    })
    .factory( ...

But, I want to be able to loop through the keys in ResourceMap and create a factory for the resource on each iteration. I tried putting it in the run function like:

.run(function(resourceMap, resourceBuilder) {
    for (res in resourceMap) {
        angular.module('resources')
            .factory(res, function(resourceMap, resourceBuilder) {
                return resourceBuilder.build(resourceMap[res]);
            });
    };
});

but this doesn't work. Does anybody know how I can do this?

The issue doesn't have anything to do with the resource function. basically I need to figure out a way to add factories to a module from within some sort of factory/service on that same module.

edit:

I tried creating another module that injects the resources module as a dependency and uses angular.foreach to loop through the resourceMap and create factories like this:

var resourceProvider = angular.module("resourceProvider", ['resources'])
resourceProvider.run(function(resourceBuilder, resourceMap) {
    angular.forEach(resourceMap, function(val, key) {
        resources.factory(key, function(resourceBuilder, resourceMap) {
            return resourceBuilder.build(val);
        });
    });
});

this is still giving me an error as it doesn't not seem to be properly creating the factories on the resources module.

Upvotes: 0

Views: 364

Answers (1)

pje
pje

Reputation: 2468

This seems like a bit of a bastardization of Angular, but you can accomplish what you're describing by doing the following:

var someResources = ['FirstFactory', 'SecondFactory', 'ThirdFactory'];
var myResourceModule = angular.module('myResources', []);

angular.forEach(someResources, function (res) {
  myResourceModule.controller(res, function ($scope) {
    $scope.name = res;
  });
});

Essentially, we're going over Angular's head and defining our resources array outside of the root scope (this is functionally the same as defining constants). Then we're just iterating through that array and defining controllers for each item in the array. You can use this in your html like this:

<div ng-app="myResources">
  <div ng-controller="FirstFactory">
    {{name}} // Shows "FirstFactory"
  </div>
  <div ng-controller="SecondFactory">
    {{name}} // Shows "SecondFactory"
  </div>
  <div ng-controller="ThirdFactory">
    {{name}} // Shows "ThirdFactory"
  </div>
</div>

Here is a plunker with the example running: http://plnkr.co/edit/e7nskmOgCx0R0ZQTBBhg?p=preview

This code could be expanded to create services, factories, etc.. Hope this helps!

--edit--

I edited the plunker example to include a service reference: http://plnkr.co/edit/e7nskmOgCx0R0ZQTBBhg?p=preview

You can reference services in your controllers/factories the same way you would reference any service. Simply create the service and inject it at controller/factory declaration.

Our resource service:

myResourceModule.service('resourceService', function() {
    var srv = {};
    srv.name = 'I\'m the resource service!'; 
    return srv;
});

Our controller with a dependency on our resource service:

myResourceModule.controller(res, function($scope, resourceService) {
  $scope.name = res;
  $scope.resourceSrvName = resourceService.name;
});

You can apply this general idea to use any injectable object inside your factories.

Upvotes: 0

Related Questions