## 14 服务
* 单例对象
* 延迟加载
* 保持数据(一致性)
* 控制器间通信
* 关联方法的集合
* 应用的整个生命周期调用一次就一直存在
### 14.1 注册服务
```
angular
.module('myApp.services', [])
.factory('UserService', function($http){
return {
method1 : function(arg1, ...){},
...
};
});
```
### 14.2 使用服务
可以在控制器、指令、过滤器、另一个服务中通过依赖声明的方式使用服务。
```
angular
.module('myApp', ['myApp.services'])
.controller('MyCtrl', ['$scope', 'UserService', function($scope, UserService){
UserService.method1(arg1, ...);
}]);
```
### 14.3 创建服务
#### 14.3.1 factory( name, getFn )
```
angular.module('myApp.service')
.factory('myService', ['$http', function($http){
return {
// ...
};
}]);
```
#### 14.3.2 service( name, ctor );
使用 `service( )` 可用注册一个支持构造函数的服务, 在创建实例时通过 `new` 来实例化服务对象.
```
angular.module('myApp.service')
.service('myService', function($http) {
this.request = function() {
return $http({method:'GET', url: 'api/user'});
}
});
```
#### 14.3.3 provider( name, { $get : Fn } )
所有服务工厂都是又 `$provider` 服务创建, 提供者必有 `$get()` 方法.
如果希望在 `config()` 中可用对服务进行配置, 必须用 `provider()` 来定义服务.
```
angular.provider('myService', function($http){
var url = '';
setUrl: function(url){
url = url;
},
$get : function($http) {
return $http({url: url});
}
});
// 待完善
angular.config(function(myService){
});
```
#### 14.3.3 constant( name, value /*常量*/ )
```
angular
.constant('appid', '123456');
.controller('MyCtrl', function($scope, appid){
$scope.appid = appid;
});
```
#### 14.3.4 value( name, value )
#### 14.3.6
### 区别 - provider, service, factory
> 参考: http://hellobug.github.io/blog/angularjs-providers/
```
// 好复杂
$provide.provider('myDate', {
$get: function() {
return new Date();
}
});
// 开发者自己实例化
$provide.factory('myDate', function(){
return new Date();
});
// angular 帮你实例化
$provide.service('myDate', Date);
```
>[success] demo
```
<!DOCTYPE html>
<html lang="zh-CN" ng-app="app">
<head>
<title>Simple app</title>
<meta charset="UTF-8">
<link href="http://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet">
<link href="http://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap-theme.css" rel="stylesheet">
<!--
<script src="http://cdn.bootcss.com/angular.js/1.1.0/angular.js"></script>
-->
<script src="http://cdn.bootcss.com/angular.js/1.4.9/angular.js"></script>
<script src="http://cdn.bootcss.com/jquery/2.2.1/jquery.js"></script>
</head>
<body>
<div class="container" ng-controller="MyCtrl">
{{user}}
</div>
<div class="container" ng-controller="MyCtrl2">
{{user}}
</div>
<script type="text/javascript">
angular
.module('app', [])
.factory('UserService', function(){
return {
name : 'username',
};
})
.service('MemberService', function(){
this.nickname = 'nickname';
})
.constant('pwd', '123456')
.value('expire','7200')
.controller('MyCtrl', function($scope, UserService, MemberService, pwd, expire){
expire = 3600;
pwd = 654321;
$scope.user = {
name : UserService.name,
nickname : MemberService.nickname,
pwd : pwd,
expire: expire
};
}).controller('MyCtrl2', function($scope, UserService, MemberService, pwd, expire){
$scope.user = {
name : UserService.name,
nickname : MemberService.nickname,
pwd : pwd,
expire: expire
};
});;
</script>
</body>
</html>
```
