AngularJS 模块化详解及实例代码

重构后的文章如下：

AngularJS的模块化：从理论到实践

AngularJS以其强大的模块化特性著称，本文将带您深入了解这一特性，并附有详细实例代码和实现效果图。对于正在寻找AngularJS模块化相关资料的小伙伴，本文将会是一个不错的参考。

让我们明白为什么要实现模块化。模块化能带来诸多好处，如增加模块的可重用性，实现加载顺序的自定义，以及在单元测试中不必加载所有内容。在之前的示例中，控制器的代码通常直接写在script标签里，这样声明的函数都是全局的，显然这并不是最佳实践。

接下来，让我们通过实践来了解AngularJS的模块化。通过全局变量angular创建一个名为myAppModule的模块。语法为：angular.module('myApp',[]); 第一个参数是应用的名称，第二个参数是依赖的模块数组。

现在，让我们看看如何使用这个模块。在HTML文件中，将ng-app指令绑定到模块名称上，这样Angular就知道在哪里开始其应用。在script标签中，我们可以通过该模块创建一个filter和一个控制器。

Filter是一种用于添加字符串修饰的工具。而控制器则用于初始化变量。通过模块化的方式，我们可以更灵活地管理和组织我们的代码。

以下是实践示例的完整HTML和JavaScript代码：

```html