AngularJS 模块
模块是 AngularJS 应用程序中的基本构建块,它是一组组件、指令、过滤器、服务等的集合,这些组件共同组成了一个应用程序。
angular.module()
是 AngularJS 中定义和创建模块的方法。
接受两个参数:
第一个参数是模块的名称
第二个参数是一个可选的依赖数组,也就是可以被注入到模块中的对象列表。。
声明模块
angular.module('myApp', []);
这个方法相当于AngularJS模块的setter方法,是用来定义模块的。
引用模块
angular.module('myApp')
这个方法相当于AngularJS模块的getter方法,用来获取对模块的引用。
1.创建模块
例如,下面的代码定义了一个名为 “myApp” 的模块,并依赖于 “ngRoute” 模块:
<script>
angular.module(“myApp“, [“ngRoute“]);
</script>
2.添加控制器
可以在应用程序中的任何地方通过模块名称引用这个模块,并在这个模块的范围内定义和使用组件、服务、指令等。
例如:
{{ firstName + ” ” + lastName }}
</div>
<script>
app.controller(“myCtrl”, function($scope) {
$scope.message = “Hello World!”;
});
3.添加指令
<div ng-app=“myApp“ runoob-directive></div>
<script>
app.directive(“runoobDirective“, function() {
return {
template : “我在指令构造器中创建!”
};
});
angular.module(“test”).directive(“a”, [“$templateCache”, function(e) {})
这条语句定义了一个名为 “a” 的 AngularJS 指令,并将其注入到名为 “test” 的 AngularJS 模块中。
这个指令使用了 AngularJS 的 $templateCache 服务作为依赖注入,表示这个指令需要通过模板来展示它的内容。在这里,模板可能被缓存到 $templateCache 中,以便在需要时快速获取并渲染。
返回值接受一个名为 “e” 的参数,它实际上是 $templateCache 服务。在函数体内可以使用这个参数来获取指令需要的模板内容,并返回一个指令对象,用于定义指令的行为和属性。指令对象可以包含 link 函数,用于在指令与 DOM 元素连接时执行一些操作。
需要注意的是,这个代码片段是 AngularJS 的旧版语法,自 AngularJS 1.3 版本以后,建议使用 component 和 templateUrl 来定义组件和模板。