3

我是 AngularJS 和一般 JS 的新手。我来自 Java 世界，因为我曾经使用 GWT 实现客户端。

现在，当我搬到 AngularJS 时，我遇到了这个问题：

如何组织你的 .js 文件？在 java 中，每个类都有它的 .java 文件，但是如果在 JS 中实现这种做法，将会有很多 http 请求来获取 .js 文件，因为每个类（ Function ）都驻留在单独的 .js 文件中。

此外，应该组织文件，以便其他程序员应该在它们之间分配和导航，并且能够阅读和理解这些文件的相关内容。

4

5 回答 5

7

不幸的是，有大约一百万种方法可以做到这一点。由于 Angular 使用模块并且您的所有 Angular 代码都应该在一个模块中，因此使用 javascript 命名空间的 IMO 成为模块命名空间的次要。

看看这个项目（angular-grunt-coffeescript）。这是我解决这个问题的尝试。我使用的是 coffeescript，但同样的想法也适用于 .js 项目。

还有angular-sprout试图扩展 'angular-seed' 项目以使其可用于大型应用程序 - angular-sprout 在 js 中。

更新

Yeoman 看起来可能会成为创建骨架 AngularJS 项目的标准，因此应该为所有东西提供一个“家”（我个人还没有使用它）。看看这里。

于 2012-11-12T17:30:35.080 回答
4

对于大型项目，我建议每个模块使用一个目录，每个“事物”（服务、价值、工厂、控制器......）一个文件。Html 部分应与它们各自的指令或控制器一起存储在每个模块目录中。

我们使用这种方法已经有一段时间了，效果确实很好。该项目由 maven 构建（后端使用 Java），所有 js 文件都连接到每个 Angular 应用程序一个文件中，另外一个文件用于在 Angular 应用程序之间共享的组件。如果您使用maven ，请查看yuicompressor-maven-plugin中的聚合。

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

我们提出的解决方案是在每个模块目录中添加一个名为 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
于 2012-12-12T12:02:45.137 回答
3

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

因此，如果您有名为LinkedList,BinaryTree,KDTreeetc 的类，您可以将它们捆绑在 DataStructures 命名空间中并将其保存在

datastructures.js

所以你可以通过说来实例化：

var kd = new Datastructures.KDTree();

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

希望这可以帮助！

于 2012-11-12T15:35:57.580 回答
2

我会推荐使用Yeoman，因为我想开发人员也是如此（他们非常提倡它，查看他们的 gPlus 页面或他们的这个视频）。它允许搭建脚手架（遵循Angular-Seed的结构）、测试、通过 JS 服务器实时预览和部署——它将所有 .js 文件连接在一起，避免了多个请求的问题。看看这个！

于 2012-11-13T20:59:49.623 回答
0

考虑到这个问题发生在不久前，为了那些今天提出这个问题的人，这里是我收集的使用 Angular 的不同最佳方法，包括它们的文件结构 http://www.dancancro.com/comparison-of-angularjs-应用程序启动器/

于 2014-09-09T04:31:28.020 回答