转换为模块应用程序 - AngularJS模块依赖项

时间:2015-05-12 21:11:14

标签: javascript angularjs angularjs-directive dependency-injection angularjs-module

我开始将我的AngularJS(完全正常工作)页面重新编译为模块化版本。

我将文件分组为4个模块:

-band
-user
-layout
-core

主app.js:

(function () {
    angular.module('zt', [

        // shared modules

        'zt.core',

        'zt.user',
        'zt.band',
        'zt.layout'

        // other modules will be lazy-loaded from router
    ]);
})();

每个模块都有自己的控制器,服务等和自己的模块配置文件:

(function() {
    'use strict';

    angular.module('zt.user', []);
})();

自己的路线档案:

(function () {
    'use strict';
angular.module('zt.user')
    .config(function ($stateProvider, $urlRouterProvider, $locationProvider, AccessLevels) {

        $stateProvider
            .state('app.user', {
                abstract: true,
                template: '<ui-view/>',
                data: {
                    access: AccessLevels.user
                }
            })

AccessLevels位于 zt.core 模块内,它很简单常量

(function() {
    "use strict";

    angular.module('zt.core')

        .constant('AccessLevels', {
            anon: 0,
            user: 1,
            mode: 2,
            admn: 3,
            suad: 4
        })

...

当我尝试加载页面时,我遇到了错误:

  

未捕获错误:[$ injector:modulerr]无法实例化模块zt   由于:错误:[$ injector:modulerr]无法实例化模块    zt.user 由于:错误:[$ injector:unpr]未知提供商:访问级别

所有文件都包含在内

(zt.band模块中的错误也一样) 所有打字和包括都可以。

当我向zt.band和zt.user路由配置添加AccessLevels手册时,会出现另一个奇怪的错误:

  

错误:[$ injector:unpr]未知提供者:ztPlayerProvider&lt; - ztPlayer   &lt; - soundManagerDirective

  

错误:[$ injector:unpr]未知提供者:AuthServiceProvider&lt; -   AuthService&lt; - ApplicationControler

ztPlayer 是使用soundManagerDirective 在同一模块zt.layout中服务

AuthService 位于共享的 zt.core 模块中,因此应该可以在 zt.layouts 模块内的ApplicationController中使用。

我在身体标记末尾附近的包含路径:

<script src="/dist/js/core/core.module.js"></script>
        <script src="/dist/js/core/core.routes.js"></script>
        <script src="/dist/js/core/config.js"></script>
        <script src="/dist/js/core/config.lazyload.js"></script>

        <script src="/dist/js/core/services/auth.services.js"></script>
        <script src="/dist/js/core/services/storage.services.js"></script>
        <script src="/dist/js/core/services/ui-load.js"></script>

        <script src="/dist/js/core/controllers/auth.controller.js"></script>
        <script src="/dist/js/core/controllers/scroll.controller.js"></script>

        <script src="/dist/js/core/directives/auth.directives.js"></script>
        <script src="/dist/js/core/directives/main.directives.js"></script>
        <script src="/dist/js/core/directives/ui.directives.js"></script>
        <script src="/dist/js/core/directives/upload.directives.js"></script>

        <!-- /core module -->

        <!-- widget module -->

        <script src="/dist/js/widget/widget.module.js"></script>

        <!-- /widget module -->

        <!-- user module -->

        <script src="/dist/js/user/user.module.js"></script>
        <script src="/dist/js/user/user.routes.js"></script>

        <script src="/dist/js/user/services/user.services.js"></script>

        <script src="/dist/js/user/controllers/dashboard.controller.js"></script>
        <script src="/dist/js/user/controllers/profile.controller.js"></script>

        <!-- /user module -->

        <!-- band module -->

        <script src="/dist/js/band/band.module.js"></script>
        <script src="/dist/js/band/band.routes.js"></script>

        <script src="/dist/js/band/controllers/band.controller.js"></script>
        <script src="/dist/js/band/controllers/track.controller.js"></script>

        <script src="/dist/js/band/services/band.services.js"></script>
        <script src="/dist/js/band/services/song.services.js"></script>
        <script src="/dist/js/band/services/track.services.js"></script>

        <!-- /band module -->

        <!-- layout module -->

        <script src="/dist/js/layout/layout.module.js"></script>

        <script src="/dist/js/layout/services/player.services.js"></script>

        <script src="/dist/js/layout/controllers/application.controller.js"></script>
        <script src="/dist/js/layout/controllers/header.controller.js"></script>
        <script src="/dist/js/layout/controllers/message.controller.js"></script>

        <script src="/dist/js/layout/directives/player.directives.js"></script>
        <script src="/dist/js/layout/directives/setnganimate.directives.js"></script>

        <!-- /layout module -->

        <!-- other -->
        <script src="/dist/js/translate/translate.js"></script>
        <script src="/dist/js/filters/fromNow.js"></script>

我尝试过很多东西,但没有任何效果!我无法弄清楚这是什么问题。

谢谢!

0 个答案:

没有答案