AngularJS实现ajax请求的方法
本文实例讲述了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.users=[{'username':"zhangsan","email":"zs@11.com"},
{'username':"zhangsan2","email":"zs@22.com"},
{'username':"zhangsan3","email":"zs@33.com"}];
*/
$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程序设计有所帮助。
-
本文向大家介绍angularJS 发起$http.post和$http.get请求的实现方法，包括了angularJS 发起$http.post和$http.get请求的实现方法的使用技巧和注意事项，需要的朋友参考一下 AngularJS发起$http.post请求 代码如下： 这时候你会发现收不到返回的数据，结果为null，这是因为要转换成form data。 解决方案： 配置$httpProv
-
本文向大家介绍AJAX请求队列实现，包括了AJAX请求队列实现的使用技巧和注意事项，需要的朋友参考一下 AJAX在使用的过程中会遇到一个问题，当用户短时间内执行了多个异步请求的时候，如果前一个请求没完成，将会被取消执行最新的一个请求，大多数情况下，不会有什么影响，例如请求了一个新的列表，旧的请求也就没什么必要了 ，但是，当我们的WEB程序需要同时异步调用多个请求，或者需要用户请求的是不同类型的数据
-
问题内容： 我正在学习AngularJS，并尝试构建从Wordpress获取数据的前端系统。 在后端，一切似乎都已正确设置，当我使用jQuery ajax请求时，它可以毫无问题地获取数据。 但是，当我尝试使用AngularJS做同样的事情时，它不起作用。我正在尝试使用以下代码复制ajax请求： 如果我将其记录下来，它将输出0。我缺少什么？ 谢谢你的帮助。 PS控制器如下所示： 问题答案： 在ang
-
本文向大家介绍jQuery Ajax实现跨域请求，包括了jQuery Ajax实现跨域请求的使用技巧和注意事项，需要的朋友参考一下 本文实例为大家分享了jQuery Ajax跨域请求的具体代码，供大家参考，具体内容如下 html 代码清单： 服务端 validate.php 代码清单： 效果图： 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持呐喊教程。
-
本文向大家介绍原生JavaScrpit中异步请求Ajax实现方法，包括了原生JavaScrpit中异步请求Ajax实现方法的使用技巧和注意事项，需要的朋友参考一下 在前端页面开发的过程中，经常使用到Ajax请求，异步提交表单数据，或者异步刷新页面。 一般来说，使用Jquery中的$.ajax，$.post，$.getJSON，非常方便，但是有的时候，我们只因为需要ajax功能而引入Jquery比较
-
本文向大家介绍jquery请求servlet实现ajax异步请求的示例，包括了jquery请求servlet实现ajax异步请求的示例的使用技巧和注意事项，需要的朋友参考一下 ajax可以发送异步请求实现无刷新效果，但是使用javascript比较麻烦，就query提供了一些封装的方法 ，可以使得操作更为简单： $.ajax（）方法： $.get()方法： $.post()方法： $.load()