基本上,我需要构建一个应用程序,它将充当各种应用程序的门户,每个代表一个业务功能(有时与彼此之间几乎没有关系)。
在本教程中,它们展示了如何创建一个具有多个视图的应用程序。我需要的是一个应用程序与多个模块,每个模块有自己的意见(我可能会有共享的意见)。
有没有人在这种结构的应用程序上工作?你能分享你的经验和你如何组织的东西吗?
AngularJS种子项目(https://github.com/angular/angular-seed)是好的,但它并没有真正展示如何构建一个复杂的应用程序。
解决方法
我在我的博客上写了一篇文章,更详细地解释一下:
read it on sam-dev.net,现在可以read part II,带代码示例。
我会回答我自己的问题。不是因为我认为这是最好的方法,而只是因为它是我决定去的。
这就是我把我的业务模块分成文件夹
>应用程式
> businessModule
>控制器
> index.js
> firstCtrl.js
> secondCtrl.js
>指令
>服务
>视图
>过滤器
> anotherBusinessModule
>共享
> app.js
> index.html
每个模块都有自己的文件夹结构用于控制器,指令等…
每个文件夹都有一个index.js文件,然后是其他文件来分隔每个控制器,每个指令等…
index.js文件包含模块的定义。例如对于上面的businessModule的控制器:
angular.module('myCompany.businessModule.controllers',[]);
这里没有依赖,但可能有任何依赖。
然后在firstCtrl.js中,我可以重用那个模块并添加控制器到它:
angular.module('myCompany.businessModule.controllers').controller('firstCtrl',function(){ });
然后app.js通过将所有我想要的应用程序模块添加到dependencies数组来聚合。
angular.module('myApp',['myCompany.businessModule','myCompany.anotherBusinessModule']);
共享文件夹包含指令和其他不是特定于业务模块的东西,并且可以在任何地方重复使用。
再次,我不知道这是否是最好的方法,但它绝对适合我。也许它可以启发其他人。
编辑
由于index.js文件包含模块声明,因此必须在任何其他应用程序脚本之前的html页面中引用它们。为此,我使用了ASP.NET MVC 4的IBundleOrderer:
var bundle = new ScriptBundle("~/bundles/app") { Orderer = new AsIsBundleOrderer() }; bundles.Add(bundle.IncludeDirectory("~/app","*.js",true)); public class AsIsBundleOrderer : IBundleOrderer { public IEnumerable<FileInfo> OrderFiles(BundleContext context,IEnumerable<FileInfo> files) { files = files.OrderBy(x => x.Name == "index.js" ? 0 : 1); return files; } }