2012-11-12 26 views
3

嗨,大家好我是AngularJS的新手,一般来说JS。我来自Java世界,因为我曾经用GWT实现客户端。如何以角度组织您的.JS文件?

现在,当我搬到AngularJS我面对这个问题:

如何组织你的.js文件?在java中,每个类都有它的.java文件,但是,如果这种做法在JS中实现,则会有许多http请求来获取.js文件,因为每个类(Function)都驻留在单独的.js文件中。

此外,文件应该组织,以便其他程序员应该分配和浏览他们之间,并能够阅读和理解这些文件相关的文件。

+1

您可以随时遵循Angular-seed的结构https://github.com/angular/angular-seed – lgomezma

回答

7

不幸的是,有大约一百万种方法来做到这一点。由于角度使用模块,并且所有角码都应位于模块中,因此使用javascript namespacing的IMO成为模块命名空间的辅助。

看看这个项目(angular-grunt-coffeescript)。这是我尝试解决这个问题。我使用coffeescript,但同样的想法可以应用于.js项目。

还有angular-sprout它试图扩大'角种子'项目一点,使其可用于大应用程序 - angular-sprout在js中。

UPDATE

约曼看起来像它可能成为创建框架AngularJS项目的标准,因此应提供的一切“家”(我个人不使用它尚未)。看看here

3

我通常将代码拆分成包含与该名称空间相关的类的名称空间。我把每个名字空间放在一个单独的JS文件中。

所以,如果你有类调用LinkedList,BinaryTree,KDTree等,你可以捆绑他们在一个数据结构的命名空间,并将其保存在

datastructures.js 

所以,那么你可以说:

var kd = new Datastructures.KDTree(); 

通过保持命名空间名称和文件名相同,您可以轻松找到实际的代码片段,而无需使用强大的IDE,因为名称本身就是自我描述的。

希望这会有所帮助!

+0

我会尽力实践它。 – Adelin

+0

@Adio如果这有帮助,请花时间接受为答案:) – stackoverflow

+0

它帮助,但它不是迄今为止我认为最好的答案。我投了答案,但不能接受它作为最好的答案,因为我不相信它。或者,我应该接受它吗? – Adelin

2

我会推荐使用Yeoman,因为我认为开发者也是如此(他们主张很多,请查看他们的gPlus页面或他们的video)。它允许脚手架(按照​​的结构),测试,通过JS服务器进行实时预览以及部署 - 它将所有.js文件连接在一起,避免了多个请求的问题。一探究竟!

+0

我会检查出来的,谢谢你的回答。 – Adelin

4

对于一个大型项目,我可以推荐每个模块使用一个目录,每个“东西”(服务,价值,工厂,控制器...)一个文件。应该将Html分支与其各自的指令或控制器一起存储在每个模块目录中。

我们一直在使用这种方法了一段时间,它是真正的工作了罚款。该项目由maven构建(Java用于后端),并且所有js文件在每个角度应用程序中连接成一个文件,另外还有一个用于角度应用程序之间共享的组件的文件。如果您是maven,请查看yuicompressor-maven-plugin中的聚合。

因为我们每个模块有几个js文件,所以我们需要一种方法来创建一个模块,并且在每个js文件中注册“thing”之前。

我们想出的解决方案是在每个模块目录中用模块创建语句添加一个名为0-module.js的文件。 yuicompressor-maven-plugin将首先添加到聚合文件中。

示例文件结构:

mymodule/ 
    0-module.js 
     >angular.module('mymodule', []); //Create module 
    MyController.js 
     >angular.module('mymodule').controller("MyController", [... // Register MyController 
    myTemplate.html