依赖注入的是服务。
app.controller app.filter app.directive app.config 都会注入服务。
但是 angular.module:
angular.module(name, [requires], [configFn]);这里没有依赖注入。 这是模块管理。
依赖注入
依赖注入(Dependency Injection)是一种经典的设计模式,主要是用来处理组件如何获取依赖的问题。
依赖注入可以简单的理解为:在一个容器中我们定义了很多个模块和组件化服务,当模块需要某些服务时,只需要跟容器说我需要这些服务,并且只需要提供服务的名称,容器就会自动提供这些服务的实例。调用服务的模块不需要考虑这些服务是怎么来的,这些服务会由容器通过依赖注入提供给对应的模块。
注入声明方式
AngularJs一共提供了三种注入方式
推断式的注入声明,显示注入声明,行内注入声明
注意的地方:当依赖注入的服务定义在了另一个模块中,首先需要将该模块注入到被依赖的模块中,然后才能调用该模块的服务
行内:
var app = angular.module('myApp', []);
app.controller('myCtrl', ['$scope', '$window', function ($scope, $window) {
// do something
}]);
AngularJS内置服务
服务是一个单例对象,在每个应用中只会被实例化一次(被$injector实例化),并且是延迟加载的(需要时才会被创建)。服务提供了把与特定功能相关联的方法集中在一起的接口。提供了在应用整个生命周期保持数据的方法, 比如下面的例子,每个controller里都可以拿到和改变foo.a,保存用户登陆等信息中我们用到了:
.controller("myCtrl", ["foo", function( foo){
foo.sayHello();
console.log(foo.a);
}])
.factory("foo", function(){
return {
a: 1,
sayHello: function(){
this.a++;
console.log("hello")
}
}
})
服务是一个对外提供某个特定功能,如消息服务、文件压缩等的独立模块。在AngularJS中,服务是一个单例对象或者函数。具有以下的两个特点:
- 服务是一个单例,即无论这个服务被注入到任何地方,对象始终只有一个实例
- 定义服务的方式也是通过function,但是与我们自己定义一个function然后在其他地方调用不同,因为服务是被定义在一个模块中,所以其使用的范围是可以被管理的,这一点体现了AngularJS非常强的避免全局变量污染意识。
代表性的内置服务
- $rootScope
每个应用都仅有一个rootScope。其他的例如controller中的scope都是rootScope的后代scope。scope通过监听数据层的变化,实现了数据层和模型层的分离。注册在$rootScope上的值可以被子$scope覆盖。
- $http
$http服务是AngularJS和远程服务器通过ajax请求进行通信的核心服务。$http的API是基于$q服务的,它返回的是一个promise。根据返回的状态码判断执行成功的回调还是失败的回调,当状态码为200到299时执行成功回调,不在这个范围内的都执行失败回调。
- $q
$q服务是AngularJS自己封装的一种对Promise的实现,使用$q一般有两种方式。
- $q构造方法
$q的构造方法接收一个函数,该函数接收resolve和reject两个参数,分别代表成功和失败后的回调函数 - $q的defer()方法
- $location
$location是用于解析地址栏URL的服务,可以监听和改变地址栏的URL。当改变地址栏或者点击前进和后退时可以与浏览器同步URL