<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/lib/AngularJS/angular.min.js"></script>
</head>
<body>
<div class="form" ng-controller="login">
账号:<input type="text" ng-model="username"><br />
密码:<input type="text" ng-model="password"><br />
<button ng-click="loginFn()">登录</button>
</div>
<script>
var app = angular.module("myApp", []);
app.controller("login", ["$scope", "$http",
function($scope, $http) {
$scope.loginFn = function() {
// 实现登录
$http({
method:"GET",
url:"http://datainfo.duapp.com/shopdata/userinfo.php",
params:{status:"login",userID:$scope.username, password:$scope.password}
/*
如果是get请求,请使用params来传递参数
如果是Post请求,请使用data来尝试传递参数
*/
}).then(
function success(resp) {
console.log("请求成功", resp);
if(resp.data instanceof Object) {
console.log("登录成功,跳转到首页");
} else {
console.log("登录失败");
}
},
function error(resp){
console.log("请求失败");
}
);
}
}]);
</script>
</body>
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/lib/AngularJS/angular.min.js"></script>
</head>
<body>
<div class="form" ng-controller="login">
账号:<input type="text" ng-model="username"><br />
密码:<input type="text" ng-model="password"><br />
<button ng-click="loginFn()">登录</button>
</div>
<script>
var app = angular.module("myApp", []);
app.controller("login", ["$scope", "$http",
function($scope, $http) {
$scope.loginFn = function() {
// 实现登录
$http({
method:"GET",
url:"http://datainfo.duapp.com/shopdata/userinfo.php",
params:{status:"login",userID:$scope.username, password:$scope.password}
/*
如果是get请求,请使用params来传递参数
如果是Post请求,请使用data来尝试传递参数
*/
}).then(
function success(resp) {
console.log("请求成功", resp);
if(resp.data instanceof Object) {
console.log("登录成功,跳转到首页");
} else {
console.log("登录失败");
}
},
function error(resp){
console.log("请求失败");
}
);
}
}]);
</script>
</body>
</html>
总结
内置服务$http
内置服务,Angular提供了很多,在使用的时候
通过依赖注入的方式在组件、控制器、自定义指令、run()函数等等中使用
$http 是一个特殊的内置服务,主要用于进行异步数据请求的功能实现
* $http({
*
* }).then(
* function success(res) {
* // 成功处理函数
* },
* function error(res) {
* // 请求失败处理函数
* }
* )
同时,提供了各种快捷的处理函数
$http.get()
$http.post()
$http.jsonp()
...