微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

模块化AngularJS应用程序:一个或多个AngularJS模块?

我尝试使用AngularJS构建模块化应用程序.我的第一个想法是通过这种文件夹结构将每个模块按功能分组:
/core 
    controllers.js
    directives.js
    app.js
/modules
     /users
        controllers.js
        directives.js
     /invoices
        controllers.js
        directives.js
     /messages        
        controllers.js
        directives.js
     ...

请注意,“core”文件夹包含将始终位于应用程序中的基本功能.其他模块可以单独添加删除.

由于我的应用程序很大,我也想使用延迟加载.我实现了这个解决方案:http://ify.io/lazy-loading-in-angularjs/在我看来实际上是最简单的方法.问题是它只对控制器,服务,指令进行延迟加载……但不适用于AngularJS模块.

我知道有另一种允许延迟加载Angular模块的方法(http://blog.getelementsbyidea.com/load-a-module-on-demand-with-angularjs/),但我认为它太过于hacky,因为它使用了Angular的核心方法.

我的问题是:在我的情况下,为我的每个模块使用不同的AngularJS模块是否有意义,如下所示:

angular.module('core',['ngRoute','users','invoices','messages'])
angular.module('users')
angular.module('invoices')
angular.module('messages')

这种方法的优点是什么? AngularJS模块目前是否有用 – 仅适用于Angular的第三方模块?

我问这个,因为AngularJS 2.0将支持本机延迟加载.来自Google的MiškoHevery说“你应该按视图分组,因为视图将在不久的将来延迟加载”,并且我们应该为每个应用程序使用一个模块,请在此处查看:https://www.youtube.com/watch?v=ZhfUv0spHCY&t=34m19s

对于大型应用程序来说,只为我的应用程序使用一个模块是正确的,['ngRoute']);

然后根据路由或视图延迟加载我的控制器,服务和指令?

我们有一个类似的结构(在一个非常大的应用程序上)到你在这里建议的那个,除了没有控制器,服务等捆绑到单个.js文件中.相反,我们只是将我们关注的视图,服务等全部捆绑到一个模块中.所以每个有意义的组件可能如下所示
/my-component
    - i-do-something.js
    - a-view.html
    - a-view-that-is-a-child.html
    - a-view-ctrl.js
    - index.js //the thing that creates a module and returns it
    / tests
         - i-do-something-spec.js
         - a-view-ctrl-spec.js

这些都捆绑在一个应用程序模块中(以我们的组织命名).然后一个简单的启动模块angular.bootstrap([‘app’])就是整个事情.我们使用browserify来编译所有这些东西,到目前为止它已经很好地工作了.

原文地址:https://www.jb51.cc/angularjs/142039.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐