无法加载提供商

Unable to load provider

我正在尝试使用 angular 提供程序,以便我可以在我的 angular 应用程序的 $routeProvider 中动态加载子模块。但是,我收到以下 2 个错误之一:

Error: [$injector:modulerr] Failed to instantiate module MainApp due to: [$injector:unpr] Unknown provider: MyRouteProvider

Error: [$injector:nomod] Module 'MainApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

这是我的:

main.js

require.config({
    baseUrl : '',
    version : '1.0',
});

require([
    'app',
    'my-route-mod/my-route-mod.module',
    'my-route-mod/my-route-mod.provider',
    'main-app/main-app.config',
    'main-app/main-app.run',
    /* other initial modules */
],function(){
   angular.bootstrap(document,['MainApp']);
});

app.js

(function(){
    'use strict';
    /* global angular, $ */

    angular.module('MainApp',[
        'MyRouteMod', /* This module does not want to load */
        'ngRoute',
        'ngCookies'
    ]);
})();

my-route-mod/my-route-mod.module.js

(function(){
    'use strict';
    /* global angular */

    angular.module('MyRouteMod',[]);
})();

my-route-mod/my-route-mod.provider.js

(function(){
    'use strict';
    /* global angular */

    angular.module('MyRouteMod')
    .provider('MyRouteModProvider',Provider);

    Provider.$inject = [];

    function Provider() {
        var provider = this;
        provider.$get = function () {
            return { route : someFunction };
        }

        function someFunction(){...}
    }
})();

main-app/main-app.config.js

(function(){
    /* global angular */
    'use strict';
    angular.module('MainApp').config(Config);

    Config.$inject = [
        'MyRouteModProvider',
        '$routeProvider',
        '$locationProvider',
        '$controllerProvider',
        '$compileProvider',
        '$filterProvider',
        '$provide'
    ];

    function Config(
        MyRouteModProvider,
        $routeProvider,
        $locationProvider,
        $controllerProvider,
        $compileProvider,
        $filterProvider,
        $provide
    ) {

        /* ... do some config stuff ... */
    }
})();

index.html

<!DOCTYPE>
<html>
    <head><title>My App</title></head>
    <body>
        <!-- Some other stuff -->
        <div ng-view></div>
        <!-- Some other stuff -->

        <script src="vendor-stuff"></script>
        <script src="vendor/require.js" data-main="main">/script>
    </body>
</html>

我将 requirejs 排除在外,并且遇到了与提供商未加载相同的问题。

我知道 MainApp 不可用,或者 MyRouteMod 不可用,或者 MyRouteModProvider 不可用。

请多多指教。

Angular 命名约定。对于提供者,字符串 'Provider' 被添加到您的构造函数名称中。所以,如果你有:

angular.module('MyMod').provider('MickeyMouse',Provider);

然后angular会寻找'MickeyMouseProvider'。所以,如果你这样做

angular.module('MyMod').provider('MickeyMouseProvider',Provider);

然后 angular 将查找 'MickeyMouseProviderProvider'

希望这能为您节省一点时间。