服务service
相当于是app提供给用户使用的变量全局变量,其目的是对controller功能的扩展
(1)在NG框架中,服务是名字,可以理解问NG下的全局变量
(2)不同controller可以根据注入服务的方式来实现通信
(3)服务有系统服务和自定义服务
1、系统服务$http
(1)NG框架内直接对数据模型内置的一个用于处理网络请求(如ajax请求等)功能的服务
(2)系统提供的服务都是带有前缀$的,自定义的一般不写$
(3)通过注入使用
app.controller('控制器名',['$scope','$http',function($scope,$http){}])
处理ajax请求
返回的内容就是json对象,不用JSON.parse()解析)
处理get有/无参请求(
在控制器脚本内
$http({
method:'GET/get',
url:'php后台路径?键=键值&...'
}).success(function(res){
回调函数
}).error(function(err){
console.log(err);
请求错误回调函数
})
处理post请求
$http({
method:'POST/post',
url:'php后台路径'
header:{
'Content-type':application/x-www-form-urlencoded'
},
data:'键名=键值&键名=键值...'
}).success(function(res){
返回回调函数
}).error(function(err){
请求错误回调函数
})
post请求下'Content-Type'两种在NG模式下无效的写法
不写默认为:'Content-Type:'multipart/form-data',表示以表单的形式发送
'Content-Type':'application/json'
代码示例:
<html ng-app='app' ng-controller='main' >
<head>
<meta charset="utf-8">
<meta name='viewport' content='width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0'>
<title ng-bind='mainTitle'></title>
<script src='js/angular.js'></script>
<script src='js/angular.route.min.js'></script>
<style>
</style>
</head>
<body >
//使用指令来写原src路径信息
<img ng-src={{imgSrc}} alt="">
<script>
var app=new angular.module('app',[]);
app.controller('main',['$scope','$http',function($scope,$http){
$scope.mainTitle='服务';
//get请求
$http({
method:'GET',
url:'6.php'
}).success(function(res){
console.log(res);
$scope.imgSrc=res.src;
}).error(function(err){
console.log('err');
})
//post请求
$http({
method:'POST',
url:'6.php',
headers:{
//不写默认为,'Content-Type:'multipart/form-data' 表示以表单的形式发送
//'Content-Type':'application/json'
//NG模式下的必要写法
'Content-Type':'application/x-www-form-urlencoded'
},
data:'username=jeff&password=123456'
}).success(function(res){
console.log(res);
}).error(function(err){
console.log(err);
})
}])
</script>
</body>
</html>