Angularjs Module Registration Structure I'm using meteor and angular. Since I can't add modules after the angular bootstrap, I made a workaround and somewhat not satisfied with the way it was coded.

How can I improve this?:

(function() {
    var controllers = ngMeteor.newControllers,
        filters     = ngMeteor.newFilters,
        directives  = ngMeteor.newDirectives,
        services    = ngMeteor.newServices

    ngMeteor.config(function($controllerProvider) {
        for (var prop in controllers) {
            if (controllers.hasOwnProperty(prop)) {
                $controllerProvider.register(prop, controllers[prop]);
            }
        }
    });

    ngMeteor.config(function($filterProvider) {
        for (var prop in controllers) {
            if (filters.hasOwnProperty(prop)) {
                $filterProvider.register(prop, filters[prop]);
            }
        }
    });

    for (var prop in directives) {
        if (directives.hasOwnProperty(prop)) {
            ngMeteor.directive(prop, directives[prop]);
        }
    }

    for (var prop in services) {
        if (services.hasOwnProperty(prop)) {
            ngMeteor.services(prop, services[prop]);
        }
    }
})();


The variables above will just have the same structure. For example:

/* Controllers */

ngMeteor.newControllers = {

    MainCtrl: function($scope) {
                // ...
    },

    SubCtrl: function($scope) {
                // ...
    }

};
Lets say you defined a module like so after the bootstrap:

myModule = angular.module('myModule',[]);


You can inject this module into ngMeteor after the bootstrap like so:

ngMeteor.requires.push('myModule');


You could easily group your controllers, directives, filters and services into separate modules and then add them to your app level module using this method. However, grouping your controllers, directives, filters and services into separate modules and then injecting it into your app level module is only one of many possible ways to organise your AngularJS app. If you're using AngularJS with MeteorJS, it would be easier to simply attach your controllers, directives, filters and services to the ngMeteor module because you have the ability to scatter these in whatever combination of javascript files as you like without having to enumerate them in your app level module. 

For example, each controller could be in a separate javascript file and they could all be located in a folder called controller. Each controller javascript file would look something like this:

ngMeteor.controller('someControllerName',[$scope,function(){...}]);


Alternatively, you could put all controllers, directives, filters and services specific to a particular route into a javascript file under that route's folder. For example, lets say you have a route called "post", you could have a folder called post, and in your post folder you could have post.html, post.css and post.js, and the post.js would look something like this:

ngMeteor
.controller('someControllerName',[$scope,function(){...}])
.directive('someDirectiveName',[$scope,function(){...}])
.filter('someFilterName',[$scope,function(){...}])
.service('someServerName',[$scope,function(){...}]);


At the end of the day though, its personal preference and ngMeteor is flexible enough to allow you to structure your app in multiple ways.