Angularjs Module类的介绍及模块化依赖
后面的学习我们会遵循一个控制器管理一个视图,一个路由对应一个视图的单一原则,所以再不会将controller控制器代码直接写到 index.html 中.
我们会应用到angular.js中强大的模块来开发,比如路由,服务,过滤器,指令等模块.
所以这一篇博客很有必要把各个模块之间的依赖关系,定义,使用等问题陈述一下.
那么angular.js 到底是如何加载启动起来的呢.
<!DOCTYPE html>
<html ng-app="YIJIEBUYI">
<head>
<script src="http://cdn.bootcss.com/angular.js/1.3.8/angular.min.js"></script> <script type="text/javascript">
var myApp = angular.module("YIJIEBUYI" , []).
controller( "myCtrl", function ($scope) {
$scope.name = '一介布衣';
});
</script>
</head>
<body>
<div ng-controller="myCtrl">
显示文字,<span ng-bind="name" ></span>
</div>
</body>
</html>
这是上一篇我们做的一个非常简单的 index.html 的页面.
启动服务后,angular.js 通过哪个main 方法启动?
事实上浏览器打开 index.html 后,angular.js 没有什么main 方法,angular.js 通过模块来代替 main,模块之间通过申明来描述其中的依赖关系,以及模块之间的组装和启动.
ng-app 指令告诉Angular.js 使用 YIJIEBUYI 模块来启动应用.
模块启动经历2个阶段.
1.Config 代码,AngularJS会连接并注册好所有数据源,不确定的服务或者数据不会注入进来.
2.Run 代码,启动你的应用,在注射器创建完成之后开始执行,只有实例和常量可以被注入到Run代码块,这时Run代码块类似其他语言的main方法.
模块可以通过API来实例化控制器,指令,过滤器和服务.
常用的API如下:
1.config(configFn)
利用此方法可以做一些注册工作,这些工作需要在模块加载时完成.
比如 ui.router 模块,完全可以在此方法中注册.
2.constant(name, object)
此方法会首先运行,所以你可以用它来声明整个应用范围内的常量,并且让它们在所有配置(config方法)和实例(后面的所有方法,例如controller、service等)方法中可用.
3.controller(name,constructor)
它的基本作用是配置好控制器方便后面使用.
4.directive(name,directiveFactory)
可以使用此方法在应用中创建指令.
5.filter(name,filterFactory)
允许你创建命名的AngularJS过滤器,就像前面章节所讨论的那样.
6.run(initializationFn)
如果你想要在注射器启动之后执行某些操作,而这些操作需要在页面对用户可用之前执行,就可以使用此方法.
7.value(name,object)
允许在整个应用中注射值.
8.factory(name,factoryFn)
如果你有一个类或者对象,需要首先为它提供一些逻辑或者参数,然后才能对它初始化,那么你就可以使用这里的factory接口。factory是一个函数,它负责创建一些特定的值(或者对象).
9.service(name,object)
factory和service之间的不同点在于,factory会直接调用传递给它的函数,然后返回执行的结果;而service将会使用"new"关键字来调用传递给它的构造方法,然后再返回结果.
10.provider(name,providerFn)
provider是这几个方法中最复杂的部分(显然,也是可配置性最好的部分).
provider中既绑定了factory也绑定了service,并且在注入系统准备完毕之前,还可以享受到配置provider函数的好处(也就是config块).
Angularjs Module类的介绍及模块化依赖的更多相关文章
- 【转】Spring学习---Bean配置的三种方式(XML、注解、Java类)介绍与对比
[原文]https://www.toutiao.com/i6594205115605844493/ Spring学习Bean配置的三种方式(XML.注解.Java类)介绍与对比 本文将详细介绍Spri ...
- Java基础-Date类常用方法介绍
Java基础-Date类常用方法介绍 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.毫秒值概念 我们在查阅Date类的API文档时,会发现这样的一句话:"The cl ...
- 北风设计模式课程---20、UML类图介绍
北风设计模式课程---20.UML类图介绍 一.总结 一句话总结: 不仅要通过视频学,还要看别的博客里面的介绍,搜讲解,搜作用,搜实例 设计模式都是对生活的抽象,比如用户获得装备,我可以先装备工厂先生 ...
- UML 类图介绍
UML 类图介绍 一. UML 简介 UML ( Unified Modeling Language )即统一建模语言,是 OMG ( Object Management Group )发表的图标式软 ...
- UML类图介绍&类的六大关系
UML类图介绍&类的六大关系 官方定义 UML(统一建模语言),是一种用于软件系统分析和设计的语言工具,用于帮助软件开发人员进行思考和记录思路的方式 UML 图形化的语言 基本介绍 UML图: ...
- oc-12-NSString 类简单介绍及用法
// 11-[掌握]NSString 类简单介绍及用法 #import <Foundation/Foundation.h> int main(int argc, const char * ...
- 【Entity Framework】初级篇--ObjectContext、ObjectQuery、ObjectStateEntry、ObjectStateManager类的介绍
本节,简单的介绍EF中的ObjectContext.ObjectQuery.ObjectStateEntry.ObjectStateManager这个几个比较重要的类,它们都位于System.Data ...
- Entity Framework 学习初级篇2--ObjectContext类的介绍
转自:http://www.cnblogs.com/Tally/archive/2012/09/14/2685014.html 本节,简单的介绍EF中的ObjectContext.ObjectQuer ...
- CImage类的介绍与使用
CImage类的介绍与使用 程序代码下载处:http://download.csdn.net/source/2098910 下载处:http://hi.baidu.com/wangleitongxin ...
随机推荐
- COM结构化存储中存储对象或者流对象的命名规则
COM结构化存储中存储对象或者流对象的命名规则
- Jmeter-Maven-Plugin高级应用:Configuring the jvm that the jmeter process runs in
Configuring the jvm that the jmeter process runs in The JMeter Maven plugin will run the JMeter proc ...
- 用Bluepages来验证intranetId和Password的有效性
代码很简单,如下: int ret = -1;ReturnCode rc = null; cwa2 cw = new cwa2();rc = cw.authenticate(in ...
- Python编程-Office操作-操作Excel(中)
例子文件如下: 一些复杂的读取操作getCells.py import openpyxl wb = openpyxl.load_workbook('example.xlsx') sheet = wb. ...
- JavaScript 之 回调函数的返回值给全局变量赋值问题
jQuery 中,会遇到$.get(url,data,callback,type) 或 $.post(url,data,callback,type) 返回值给全局变量赋值的问题: 例如: <sc ...
- PHP表单- PHP $_GET 变量
PHP $_GET 变量 在 PHP 中,预定义的 $_GET 变量用于收集来自 method="get" 的表单中的值. $_GET 变量 预定义的 $_GET 变量用于收集来自 ...
- UML类图聚集与组合的区别
http://blog.csdn.net/zwf0713/article/details/2025922 设计模式中组合和聚集好像挺相似,但有一定区别. 1-在图上的区别是,聚集用空心,组合用实心: ...
- Linux网卡高级命令
网卡的高级命令 [root@gechong ~]# mii-tool No interface specified usage: mii-tool [-VvRrwl] [-A media,... | ...
- this词法
1.示例代码 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UT ...
- load()和get()的区别
区别1:如果数据库中,没有userId的对象.如果通过get方法加载,则返回的是一个null:如果通过load加载,则返回一个代理对象,如果后面代码如果调用user对象的某个属性(比如user.get ...