angularjs学习笔记--服务
今天初步了解了angularjs中的服务,服务是一个函数或者对象。我们一般调用或直接使用,angularjs有自己内置的服务,也可以自定义服务。
我们为什么要使用服务?其实服务相当于共用部分的一个封装,比如当我们在写控制器的时候,有很多控制器,它们之间有共同的部分,如果每个控制器里都重复这段代码那会显得比较冗余,我们最直接的想法就是把它单独抽离出来,当作一个公共的部分,可以调用。其实在angularjs中就是把公共的部分抽离成一个服务。内置的一些服务,比如说$http,$timeout,$window等等是直接可以用的,有时我们可以根据我们的需求自己定义服务。
下面是一个$http服务使用的一个小demo
$http服务
-
{{user.text}}
var app = angular.module('mySer', []);
app.controller('LoadDataCtrl', ['$scope', '$http', function ($scope, $http) {
$http({
method:'GET',
url:'user.json'
}).success(function (data, status, headers, config) {
console.log("获取成功");
console.log(data);
$scope.users = data;
console.log(status);
console.log(headers);
console.log(config);
}).error(function (data, status, headers, config) {
console.log(data);
console.log(status);
console.log(headers);
console.log(config);
})
}])
其后面链式的两个方法分别是成功和失败时要执行的函数。
再举一个例子,$timeout服务,这个有些类似于js中的setTimeout,设置定时器。
$timeout(fn,[delay],[invokeApply]);
第一个参数是延时执行后的函数,第二个参数是延时时间(单位毫秒),第三个参数是bool值,设置是否需要脏值检测,默认为false,如果为true,则回掉函数会被包在$scope.$apply中
返回值是一个promise对象
方法:$timeout.cancel() 用来取消回掉函数的执行,相当于定时器清零。
下面是一个小demo
$timeout练习
var timeoutApp = angular.module('timeoutApp',[]);
//如果打开注释,执行.cancel()方法,那么$timeout的回调就不会被执行,它返回的promise被reject,控制台打印:
timeoutApp.run(function($timeout){
var a = $timeout(function(){
console.log('执行$timeout回调');
return 'angular'
},1000);
a.then(function(data){
console.log(data)
},function(data){
console.log(data)
});
//$timeout.cancel(a);
})
1.service都是单例的,只有一个实例。
2.service由$injector负责实例化,不需要自己去new,对于这两点原理上还不是很了解,随着后面对angular的继续学习再探索吧~
3.service在整个应用的生命周期中存在,可以用来共享数据。
4.在需要使用的地方利用依赖注入机制注入service
5.自定义的service需要些在内置的service后面,注意顺序
6.内置的service以$符号开头,自定义的应该避免这样命名,用以区分。
今天就总结这些,明天继续~