角添加模块后，角。引导

I'm using meteor + angular. My intention is to add more dependencies after the app bootstrap (This is because the package is the one handling the bootstrapping at the start and I don't have much control of it). Now while doing that, I would also want to enforce a basic code structure wherein for example, I would compile all controllers in one module.

我用的是流星+角。我的目的是在应用程序引导之后添加更多的依赖项(这是因为包是在开始时处理引导的包，我对它没有太多控制)。在这样做的同时，我还想执行一个基本的代码结构，例如，在一个模块中编译所有的控制器。

Here's the basic idea:

这里的基本思想:

'use strict';

angular.module('app.controllers', [])

    .controller('MainCtrl', function() {
        // ...
    })

    .controller('SubCtrl', function() {
        // ...
    })

    .controller('AnotherCtrl', function() {
        // ...
    });

Then include that to the main module as dependency:

然后将其包含到主要模块中作为依赖项:

angular.module('app', [
    'app.filters',
    'app.services',
    'app.directives',
    'app.controllers' // Here
]);

After some research, I've discovered that what I'm trying to do (Adding dependencies after bootstrap) is actually a part of a feature request to the angular team. So my option is using, for example, $controllerProvider and register() function:

经过一些研究之后，我发现我正在尝试做的(在引导之后添加依赖项)实际上是对有棱角的团队的特性请求的一部分。所以我的选项是使用，例如，$controllerProvider和register()函数:

Meteor.config(function($controllerProvider) {
    $controllerProvider.register('MainCtrl', function($scope) {
        // ...
    });
});

Meteor.config(function($controllerProvider) {
    $controllerProvider.register('SubCtrl', function($scope) {
        // ...
    });
});

Meteor.config(function($controllerProvider) {
    $controllerProvider.register('AnotherCtrl', function($scope) {
        // ...
    });
});

It's works though not that elegant. The questions are:

虽然不是很优雅。的问题是:

What's a more elegant way of doing the config and register part?
配置和注册部分更优雅的方式是什么?
Is there a way to register a module instead?
有没有办法注册一个模块?

3 个解决方案

#1

Create your module:

创建您的模块:

angular.module('app.controllers', []);

Add it as a dependency:

将其添加为依赖项:

angular.module('app').requires.push('app.controllers');

#2

The only method that I've seen that works is replacing the angular.module function with your own function returning the module you used to bootstrap your app.

我看到的唯一可行的方法就是替换角度。模块功能和你自己的功能返回你用来引导你的应用的模块。

var myApp = angular.module('myApp', []);    
angular.module = function() {
    return myApp;
}

So that all modules that are registered afterwards are actually being registered in your myApp module.

所有之后注册的模块都在myApp模块中注册。

This method combined with the one you describe in the question (using providers like $controllerProvider) will allow you to add "modules" after angular.bootstrap.

此方法与您在问题中描述的方法(使用$controllerProvider这样的提供程序)相结合，将允许您在angular.bootstrap之后添加“模块”。

Demo

演示

See this jsfiddle for a demo: https://jsfiddle.net/josketres/aw3L38r4/

参见这个jsfiddle获得演示:https://jsfiddle.net/josketres/aw3L38r4/

Drawbacks

缺点

The config blocks of the modules that are added after angular.bootstrap will not be called. Maybe there's a way to fix this, but I haven't found it.
在角之后添加的模块的配置块。不会调用引导程序。也许有办法解决这个问题，但我还没找到。
Overriding angular.module feels like a "dirty hack".
覆盖角。模块感觉像是一个“肮脏的黑客”。

#3

according to this presentation (slide 12) you can assign controllerProvider to app.

根据这个演示(幻灯片12)，你可以为app分配controllerProvider。

Example of replacing module's controller method: http://jsfiddle.net/arzo/HB7LU/6659/

替换模块控制器方法的示例:http://jsfiddle.net/arzo/HB7LU/6659/

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

//note overriding controller method might be a little controversial :D 
myApp.config(function allowRegisteringControllersInRuntime($controllerProvider) {
    var backup = myApp.controller;
    myApp.controller = $controllerProvider.register;
    myApp.controller.legacy = backup;
})

myApp.run(function ($rootScope, $compile) {

    myApp.controller('MyCtrl', function($scope) {
        $scope.name = 'Superhero';
    })

    var elem;
    var scope=$rootScope;
    elem = $compile('<p ng-controller="MyCtrl">{{name}}</br><input ng-model="name" /></p>')($rootScope, function (clonedElement, scope) {
        console.log('newly created element', clonedElement[0])
        document.body.appendChild(clonedElement[0]);
    });
    console.log('You can access original register via', myApp.controller.legacy);
})

#1