服务用来提供公用类库
http://blog.csdn.net/zcl_love_wx/article/details/51404390(参考)
一、3种创建自定义服务的方式
{{r}}
1、Factory
factory方式创建的服务,作用就是返回一个有属性有方法的对象。相当于:var f = myFactory();
var app = angular.module('myApp', []);
//通过工厂模式创建自定义服务
app.factory('myFactory', function() {
var service = {};//定义Object对象
service.name = "wy";
var age;//定义一个私有化的变量
//对私有属性写getter和setter方法
service.setAge = function(newAge){
age = newAge;
}
service.getAge = function(){
return age;
}
return service;//返回这个Object对象
});
//创建控制器
app.controller('myCtrl', function($scope, myFactory) {
myFactory.setAge(20);
$scope.r =myFactory.getAge();
alert(myFactory.name);
});
在自定义服务里可以注入服务,但不能注入http,$q)`
2、Service
通过service方式创建自定义服务,相当于new的一个对象:var s = new myService();,把属性和方法添加到this上才可以在controller里调用。
var app = angular.module('myApp', []);
app.service('myService', function($http,$q) {
this.name = "service";
this.myFunc = function (x) {
return x.toString(16);//转16进制
}
this.getData = function(){
var d = $q.defer();
$http.get("ursl")//读取数据的函数。
.success(function(response) {
d.resolve(response);
})
.error(function(){
alert(0)
d.reject("error");
});
return d.promise;
}
});
app.controller('myCtrl', function($scope, myService) {
$scope.r = myService.myFunc(255);
myService.getData().then(function(data){
console.log(data);//正确
},function(data){
alert(data)//错误
});
});
3、Provider
只有provder是能传 .config() 函数的 service,若想在 service 对象启用之前,先进行模块范围的配置,那就应该选择 provider。
4、在过滤器中注入自定义服务
在过滤器中使用服务: '{{255 | myFormat}}'
二、service与controller、directive交互
//自定义指令
- 书名:{{i.title}},作者:{{i.author}}
var appModule = angular.module(‘app‘, []);
// service 单例,共享数据
appModule.service(‘Book‘, [‘$rootScope‘, function($root){
var service = {
books: [
{
"title": "书名1",
"author": "作者1"
},
{
"title": "书名2",
"author": "作者2"
}
],
addBook: function(book){
service.books.push(book);
// 给root下所有books.update派发事件
$root.$broadcast(‘books.update‘);
}
};
return service;
}]);
(1)
// 在控制器里使用Book服务
appModule.controller(‘books.list‘, [‘$scope‘, ‘Book‘, function(scope, Book){
scope.books = Book.books;
scope.$on(‘books.update‘, function(){
scope.$apply(function(){
scope.books = Book.books;
});
});
}]);
// (2)在指令里使用Book服务
appModule.directive(‘addBookButton‘, [‘Book‘, function(Book){
return {
restrict: ‘A‘,
link: function(scope, el){
var n = 0;
el.bind(‘click‘, function(){
Book.addBook({
"title": "新书"+(++n),
"author": "新作者"+n
});
});
}
};
}]);