AngularJS中$http使用的简单介绍


Posted in Javascript onMarch 17, 2017

在AngularJS中主要使用$http服务与远程http服务器交互,其作用类似于jquery中的$.ajax服务:

  1. $http是AngularJS的一个核心服务,利用浏览器的xmlhttprequest或者via JSONP对象与远程HTTP服务器进行交互;
  2. 与$.ajax相同,支持多种method请求:get、post、put、delete等;
  3. controller中可通过与$scope同样的方式获取$http对象,形如:function controller($ http, $ scope){};

$http使用说明:

$http服务使用如下面代码所示:

// 1.5以下版本
$http(config)
.success(function(data, status, headers, config){//请求成功执行代码})
.error(function(data, status, headers, config){//请求失败执行代码})

// 1.5以上版本
$http(config).then(
function successCallback(response){//请求成功执行代码},
function errorCallback(response){//请求失败执行代码}
);

具体参数、方法说明:

配置参数:

  1. config是请求的配置参数总集,格式为json;
  2. 包含的配置项包括:
  3. method:字符串类型,请求方式如"GET","POST","DELETE"等;
  4. url:字符串类型,请求的url地址;
  5. params:json类型,请求参数,将在url上被拼接成?key=value的形式;
  6. data:json类型,请求数据,将放在请求内发送至服务器;
  7. cache:bool类型,true表示http GET请求时采用默认的$http cache,否则使用$cacheFactory的实例;
  8. timeout:整数类型,超时时间;

回调函数:

  1. success是请求成功后的回调函数;
  2. error是请求失败后的回调函数;
  3. data是响应体;
  4. status是相应的状态值;
  5. headers是获取getter的函数;
  6. config是请求中的config json对象;

method属性可以作为config配置参数中的一个属性,也可以直接作为方法调用,如:

$http.post(url, data, config)

$http使用范例:

var searchOplog = function ($http, table, btn) {
 $http({
  url: 'data/oplog.json',
  method: 'GET'
 }).then(function successCallback(response) {
  console.log('get Oplog success:', response);
  table.init(response.data);
  btn.button('reset');
  btn.dequeue();
 }, function errorCallback(response) {
  console.log('errorCallback Response is:', response);
  table.init();
  btn.button('reset');
  btn.dequeue();
 });
};

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS解决url传值出现中文乱码的另类办法
Apr 08 Javascript
js使用正则实现ReplaceAll全部替换的方法
Aug 22 Javascript
js QQ客服悬浮效果实现代码
Dec 12 Javascript
AngularJS入门教程之AngularJS模型
Apr 18 Javascript
深入理解js中this的用法
May 28 Javascript
jQuery控制div实现随滚动条滚动效果
Jun 07 Javascript
Angular 路由route实例代码
Jul 12 Javascript
JavaScript实现二分查找实例代码
Feb 22 Javascript
AngularJS使用ocLazyLoad实现js延迟加载
Jul 05 Javascript
vue2.0 + element UI 中 el-table 数据导出Excel的方法
Mar 02 Javascript
浅谈Angular HttpClient简单入门
May 04 Javascript
vue监听对象及对象属性问题
Aug 20 Javascript
单击按钮发送验证码,出现倒计时的简单实例
Mar 17 #Javascript
jQuery Ajax前后端使用JSON进行交互示例
Mar 17 #Javascript
Bootstrap表格制作代码
Mar 17 #Javascript
鼠标经过出现气泡框的简单实例
Mar 17 #Javascript
angularJS之$http:与服务器交互示例
Mar 17 #Javascript
Bootstrap下拉菜单Dropdowns的实现代码
Mar 17 #Javascript
Bootstrap面板(Panels)的简单实现代码
Mar 17 #Javascript
You might like
Yii Framework框架获取分类下面的所有子类方法
2014/06/20 PHP
ThinkPHP中__initialize()和类的构造函数__construct()用法分析
2014/11/29 PHP
PHP封装CURL扩展类实例
2015/07/28 PHP
PHP闭包函数传参及使用外部变量的方法
2016/03/15 PHP
php生成条形码的图片的实例详解
2017/09/13 PHP
PHP实现爬虫爬取图片代码实例
2021/03/03 PHP
用prototype实现的简单小巧的多级联动菜单
2007/03/24 Javascript
获取服务器传来的数据 用JS去空格的正则表达式
2012/03/26 Javascript
防止xss和sql注入:JS特殊字符过滤正则
2013/04/18 Javascript
解析Jquery中如何把一段html代码动态写入到DIV中(实例说明)
2013/07/09 Javascript
jquery的ajax简单结构示例代码
2014/02/17 Javascript
javascript设计模式之对象工厂函数与构造函数详解
2015/07/30 Javascript
jQuery使用$.ajax进行即时验证的方法
2015/12/08 Javascript
AngularJS的ng-click传参的方法
2017/06/19 Javascript
nodeJS(express4.x)+vue(vue-cli)构建前后端分离实例(带跨域)
2017/07/05 NodeJs
关于Promise 异步编程的实例讲解
2017/09/01 Javascript
详解tween.js 中文使用指南
2018/01/05 Javascript
vue实现表单未编辑或未保存离开弹窗提示功能
2020/04/08 Javascript
最基础的Python的socket编程入门教程
2015/04/23 Python
TensorFlow安装及jupyter notebook配置方法
2017/09/08 Python
Python搜索引擎实现原理和方法
2017/11/27 Python
django框架实现一次性上传多个文件功能示例【批量上传】
2019/06/19 Python
python 机器学习之支持向量机非线性回归SVR模型
2019/06/26 Python
Python中最好用的命令行参数解析工具(argparse)
2019/08/23 Python
Python opencv相机标定实现原理及步骤详解
2020/04/09 Python
Python求凸包及多边形面积教程
2020/04/12 Python
python 对一幅灰度图像进行直方图均衡化
2020/10/27 Python
css3加js做一个简单的3D行星运转效果实例代码
2017/01/18 HTML / CSS
香港个人化生活购物网站:Ballyhoo Limited
2016/09/10 全球购物
新大陆软件面试题
2016/11/24 面试题
珍惜资源的建议书
2014/08/26 职场文书
世界卫生日宣传活动总结
2015/02/09 职场文书
2015年大学班主任工作总结
2015/04/30 职场文书
解析MySQL binlog
2021/06/11 MySQL
Sleuth+logback 设置traceid 及自定义信息方式
2021/07/26 Java/Android
MySQL 数据库 增删查改、克隆、外键 等操作
2022/05/11 MySQL