Question

我正在尝试创建一些可以跨应用程序和模块重用的AngularJS库。我以为我正在做的一切正确，但仍然有问题。

首先，我创建一个定义通用模块（app.ui）的文件，并将提供程序（LayoutManager）附加到它... （我正在使用一个名为＆＃34的jQuery插件; jQuery Layout＆＃34;这个提供程序允许应用程序访问和操作布局参数。但是我不想挂断插件的细节。这个问题比较笼统，但我想至少应该提供一些解释）

angular.module("app.ui", [])
    .provider('LayoutManager', [function () {
        'use strict';

        var appLayout = $('body').layout(),
        moduleNavLayout = $('.module-nav-container').layout(),
        moduleLayout = $('.module-content-container').layout();

        return {
            $get: function () {
                return {
                    ApplicationLayout: appLayout,
                    ModuleNavigatonLayout: moduleNavLayout,
                    ModuleContentLayout: moduleLayout
                }
            }
        }
    }]);

然后我将模块（app.ui）识别为＆＃34; app＆＃34;的依赖关系。（ListMgrApp）我想在它中使用它。

angular.module("ListMgrApp", ["ui.router", "app.services", "app.ui"])

然后我将特定提供者（LayoutManager）注入（是正确的术语吗？）到应用程序中......

angular.module("ListMgrApp", ["ui.router", "app.services", "app.ui"]).
    config(['$stateProvider', 'LayoutManager',
        function ($stateProvider, layout) {
            'use strict';
            // initialization code goes here
        }]);

虽然看起来LayoutManager提供程序中的代码执行了，我认为这是因为它被包含为应用程序的依赖项，但是当它运行时，我仍然从应用程序中收到以下错误。

Uncaught Error: [$injector:modulerr] Failed to instantiate module ListMgrApp due to:
Error: [$injector:unpr] Unknown provider: LayoutManager

我已经确认所有必需文件的源代码都已成功下载。

我错过了什么？

解决

感谢 elclanrs 的答案！我只想添加我更新的内容以使其正常工作。

我添加了＃34;提供商＆＃34;到app（ListMgrApp）的config（）方法中的提供程序（LayoutManager）的名称。我原本以为我应该也改变＆＃34; LayoutManager＆＃34;的名称。在提供商代码中但误读了原始解决方案评论。仅更改app config（）方法中的名称。我想我会在这里指出它以防万一其他人是一个＆＃34;撇去＆＃34;并错过了它。

angular.module("ListMgrApp", ["ui.router", "app.services", "app.ui"]).
    config(['$stateProvider', 'LayoutManagerProvider',
        function ($stateProvider, layout) {
            'use strict';
            // initialization code goes here
        }]);

创建可重用的AngularJS提供程序/指令/工厂等

0 个答案: