AngularJS实现ajax请求的方法

时间：2021-05-28

本文实例讲述了AngularJS实现ajax请求的方法。分享给大家供大家参考，具体如下：

【HTML 代码】

<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1"> <link rel="stylesheet" type="text/css" href="" /> <title>angularjs实现 ajax</title></head><body ng-app="HelloAjax"> <div ng-controller="HelloAjax"> <form> <input type="text" ng-model="username" /> <input type="text" ng-model="email" /> </form> <table> <tr ng-repeat="user in users"> <td>{{user.username}}</td> <td>{{user.email}}</td> </tr> </table> <button ng-click="get_more();">get more</button> </div></body><script type="text/javascript" src="./js/angular.min.js" charset="utf-8"></script> <script type="text/javascript" src="ajax.js" charset="utf-8"></script></html>

【js代码 ajax.js】

var myModule = angular.module("HelloAjax",[]);myModule.controller("HelloAjax",["$scope","$http",function HelloAjax($scope,$http){ $scope.get_more = function(){ $http({ method: "POST", url: "./ajax.php", data:{'username':$scope.username, 'email':$scope.email } }). success(function(data, status) { //$scope.status = status; $scope.users = data; }). error(function(data, status) { //$scope.data = data || "Request failed"; //$scope.status = status; }); }}]);

【PHP代码 ajax.php】

<?php//获取参数$data = file_get_contents("php://input");$user = json_decode($data);//查询数据库$conn = mysql_connect("localhost","root","");mysql_select_db("test");$sql ="select username,email from users ";$res = mysql_query($sql,$conn);$users = array();while($row = mysql_fetch_assoc($res)){ $users[] = $row;}//当然这里简化了插入数据库$users[] = array('username'=>$user->username, 'email'=>$user->email);//返回数据库echo json_encode($users);

更多关于AngularJS相关内容感兴趣的读者可查看本站专题：《AngularJS入门与进阶教程》、《jQuery常用插件及用法总结》、《jquery中Ajax用法总结》、《JavaScript中ajax操作技巧总结》及《PHP+ajax技巧与应用小结》

希望本文所述对大家AngularJS程序设计有所帮助。

声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

相关文章