2016-01-06 53 views
1

我正在使用已在Ionic中进行特定验证的项目。我必须为管理面板实现相同的功能,因此我已经安装了所有的依赖项,配置了应用程序,并且已经在ZURB Foundation for Apps 1.1中完成了HTML/CSS。 现在我陷入了控制器和服务的实施。

我阅读官方文档,并没有太多的自定义控制器和服务的解释,所以我在网上找到了几个解释应用程序基础结构的文本。我还发现与结构的样本应用程序,在此说明:ORGANIZING ANGULAR FILES IN ZURB FOUNDATION FOR APPS,从这里复制的每个页面的示例文件:Foundation for Apps Template

所以我把我的应用程序的关于,联系方式,家庭内部和共享文件夹内资产/ js文件夹。

因此,例如,在共享文件夹中包含controllers.js文件用下面的代码:

(function() { 
    'use strict'; 
    var controllers; 

    AppCtrl.$inject = ['$scope']; 
    function AppCtrl($scope) { 
     // This is a shared controller because its the application parent controller 
    } 

    controllers = { 
     AppCtrl: AppCtrl 
    }; 

    angular.module('SharedModule').controller(controllers); 
}) 

module.js文件包含此:

(function() { 
    'use strict'; 
    angular.module('SharedModule', [ /* Dependencies to be shared everywhere */ ]); 
}) 

应用程序。 js文件与生成的文件具有几乎相同的代码,但指定了自定义模块:

(function() { 
    'use strict'; 

    angular.module('application', [ 
    'ui.router', 
    'ngAnimate', 

    //foundation 
    'foundation', 
    'foundation.dynamicRouting', 
    'foundation.dynamicRouting.animations', 

    // My modules 
    'SharedModule', 
    'ContactModule', 
    'AboutModule', 
    'HomeModule' 
    ]) 
    .config(config) 
    .run(run) 
    ; 

    config.$inject = ['$urlRouterProvider', '$locationProvider']; 

    function config($urlProvider, $locationProvider) { 
    $urlProvider.otherwise('/'); 

    $locationProvider.html5Mode({ 
     enabled:false, 
     requireBase: false 
    }); 

    $locationProvider.hashPrefix('!'); 
    } 

    function run() { 
    FastClick.attach(document.body); 
    } 

})(); 

所以现在,当我运行的应用程序,我得到以下错误:

Uncaught Error: [$injector:modulerr] Failed to instantiate module application due to: Error: [$injector:modulerr] Failed to instantiate module HomeModule due to: Error: [$injector:nomod] Module 'HomeModule' 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.

任何帮助,将不胜感激,谢谢。

回答

0

我修复了这个问题。

我试着逐个删除模块来测试单个模块是否存在问题,但引发了相同的错误,所以我也检查了单个文件,但是文件看起来与样本中的相同应用程序。然后,我检查了是否调用了依赖关系,但由于它们不像在常规的AngularJS应用程序中那样在索引文件内部调用,所以我比较了gulpfile.js并附带解决方案: 在appJS数组中,我必须包含路径对于.js文件,现在部分gulpfile.js看起来像这样:

appJS: [ 
    'client/assets/js/app.js', 

    // Load my modules 
    'client/assets/js/*/module.js', 
    'client/assets/js/*/controllers.js', 
    'client/assets/js/*/factories.js', 
    'client/assets/js/*/services.js', 
    'client/assets/js/*/directives.js' 
    ] 
相关问题