在组织AngularJS应用时，你的模块是否都有相同的名称?

When organizing an AngularJS app, should your modules all have the same name?

本文关键字：是否 模块 应用 AngularJS      更新时间：2023-09-26

当组织一个更大的Angular项目时，你的模块应该有相同的名称吗?我在各地都看到过这两种情况的例子。

给出如下结构:

root-app-folder
├── index.html
├── scripts
│   ├── controllers
│   │   └── main.js
│   │   └── ...
│   ├── directives
│   │   └── myDirective.js
│   │   └── ...
│   ├── filters
│   │   └── myFilter.js
│   │   └── ...
│   ├── services
│   │   └── myService.js
│   │   └── ...
│   ├── vendor
│   │   ├── angular.js
│   │   ├── angular.min.js
│   │   ├── es5-shim.min.js
│   │   └── json3.min.js
│   └── app.js
├── styles
│   └── ...
└── views
    ├── main.html
    └── ...

您通常会让每个文件以angular.module('appName')...开头，还是让它们是唯一的，例如angular.module('thisModuleName)... ?

两者的优点和缺点是什么?

在一个典型的项目中，您将只使用单个模块。一般来说，模块将在app.js文件中使用数组语法声明:

angular.module('app', ['dep1', 'dep2'])

其中dep1和dep2是模块需要的任何依赖项。然后在任何其他文件-例如控制器-您只需将其链接到app模块，如下所示:

angular.module('app').controller(...) // no dependency array

AngularJS有一个内置的依赖注入机制。你可以把你的应用分成多个不同类型的组件，让AngularJS可以相互注入。模块化应用程序可以更容易地重用、配置和测试应用程序中的组件。

AngularJS包含以下核心类型的对象和组件:

  • 工厂
  • 提供者
    • <
  • 常数/gh>

这些核心类型可以通过AngularJS依赖注入机制相互注入。在本文的其余部分中，我将解释如何定义这些组件并将它们相互注入。

相关文章：