服务是一个对象或函数,对外提供特定的功能。
1、内置服务
-
$location是对原生Javascript中location对象属性和方法的封装。
service.controller("DemoController",['$scope','$location',function ($scope,$location) {
// 获取当前项目的绝对路径
$scope.absUrl = $location.absUrl();
// 协议
$scope.protocol= $location.protocol()
// 端口
$scope.port = $location.port()
// 当前路径
$scope.path = $location.path()
// 主机
$scope.host = $location.host()
// url
$scope.url = $location.url();
}])
在这里注意URL中它是获取的锚点以后的地址。
-
$filter在控制器中格式化数据。
service.controller("DemoController",['$scope','$filter',function ($scope,$filter) {
// $filter是九种过滤器中任何一个
$scope.price = 11.11;
var currency = $filter('currency');
$scope.price = currency($scope.price);
$scope.str = 'hello angular';
var uppercase = $filter('uppercase');
$scope.str = uppercase($scope.str);
$scope.str1 = $filter('limitTo')($scope.str, 2);
}])
过滤器(filter)也可以作为服务,他与我们在视图(view)中调用过滤器是一样的,只不过作为服务来讲,是在控制器中格式化数据,而普通的在视图中就可以调用。
-
$log打印调试信息
service.controller("DemoController",['$scope','$log',function ($scope,$log) {
$log.info('普通信息');
$log.warn('警告信息');
$log.error('错误信息');
$log.log('打印信息');
$log.debug('调试信息');
}])
-
$http用于向服务端发起异步请求(重点)
$http本质上是对XMLHttpRequest
对象的封装,那么原生的的对象要发送一个请求:
var xhr = new XMLHttpRequest;
// 打开一个链接
xhr.open('get/post', 'example.php?name=eurasia');
//设置一个请求头
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send('age=10');
$http
是对原生的进行封装,只要把上面的那些封装成参数就可以了,$http()
,是一个函数,并不是每次请求的参数是一样的,想要变成不一样的,需要一个参数,请求的方式既可以是get也可以是post,如果完成一个请求需要多个参数的时候,当一个对象来传会更方便一些。那么.success
是函数$http()
的一个返回值,这样也表示成功。
$http({
url: 'example.php',
// method: 'get',
method: 'post',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
params: { // get 参数
name: 'eurasia',
sex: '男'
},
// data: 'age=10'
data: { // post 传参
age: 10
}
}).success(function (info) {
// info 就是返回的数据
$log.info(info);
});
当我们使用get传参的时候,要放到url后面去,在AngularJs中就不需要写了,会有一个如下这样的传递方式,最终就会拼接成example.php?name = eurasia
这种形式
params: { // get 参数
name: 'eurasia',
sex: '男'
},
当我们使用post发送参数的时候要放到send中,在这专门为send提供了一个参数data,如下这种方式,这样就相当于xhr.send('age=10')
;
data: { // post 参数
age: 10
},
1、传递的数据可以是key=val&key=val
形式,这种形式叫formData
2、Content-Type 设成 application/x-www-form-urlencoded
3、当请求数据类型不一样,后端在接收的时采取方法也不一样
4、假如上述方式以PHP为例可以使用$_POST接收
5、application/json;charset=UTF-8
就是json对象形式传
6、假如采用上述方式,以PHP为例$_POST就不能接收了