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 相关文章推荐
Javascript继承(上)——对象构建介绍
Nov 08 Javascript
Jquery图片滚动与幻灯片的实例代码
Apr 08 Javascript
jQuery判断checkbox是否选中的小例子
Dec 02 Javascript
scroll事件实现监控滚动条并分页显示(zepto.js)
Dec 18 Javascript
JS中Swiper的使用和轮播图效果
Aug 11 Javascript
JavaScript实现简单的文本逐字打印效果示例
Apr 12 Javascript
原生JS实现动态加载js文件并在加载成功后执行回调函数的方法
Dec 30 Javascript
微信小程序日历/日期选择插件使用方法详解
Dec 28 Javascript
vue2 拖动排序 vuedraggable组件的实现
Aug 08 Javascript
小程序最新获取用户昵称和头像的方法总结
Sep 23 Javascript
JS Web Flex弹性盒子模型代码实例
Mar 10 Javascript
请求时token过期自动刷新token操作
Sep 11 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
Windows下部署Apache+PHP+MySQL运行环境实战
2012/08/31 PHP
php 注册时输入信息验证器的实现详解
2013/07/05 PHP
一个PHP针对数字的加密解密类
2014/03/20 PHP
PHP使用逆波兰式计算工资的方法
2015/07/29 PHP
Nginx环境下PHP flush失效的解决方法
2016/10/19 PHP
Laravel5.* 打印出执行的sql语句的方法
2017/07/24 PHP
php7 错误处理机制修改实例分析
2020/05/25 PHP
React实现点击删除列表中对应项
2017/01/10 Javascript
JS实现自定义状态栏动画文字效果示例
2017/10/12 Javascript
echarts学习笔记之箱线图的分析与绘制详解
2017/11/22 Javascript
JavaScript实现左侧菜单效果
2017/12/14 Javascript
js统计页面上每个标签的数量实例代码
2018/05/29 Javascript
微信小程序实现左右联动的实战记录
2018/07/05 Javascript
如何在vue里添加好看的lottie动画
2018/08/02 Javascript
Vue-router 切换组件页面时进入进出动画方法
2018/09/01 Javascript
原来JS还可以这样拆箱转换详解
2019/02/01 Javascript
[49:12]完美世界DOTA2联赛PWL S2 Magma vs GXR 第二场 11.29
2020/12/02 DOTA
python网络编程实例简析
2014/09/26 Python
pymongo为mongodb数据库添加索引的方法
2015/05/11 Python
Python使用plotly绘制数据图表的方法
2017/07/18 Python
Python实现基于多线程、多用户的FTP服务器与客户端功能完整实例
2017/08/18 Python
使用OpenCV实现仿射变换—缩放功能
2019/08/29 Python
pytorch下大型数据集(大型图片)的导入方式
2020/01/08 Python
Python Pandas 对列/行进行选择,增加,删除操作
2020/05/17 Python
python模块如何查看
2020/06/16 Python
python利用递归方法实现求集合的幂集
2020/09/07 Python
python 基于UDP协议套接字通信的实现
2021/01/22 Python
Python try except finally资源回收的实现
2021/01/25 Python
pycharm 使用anaconda为默认环境的操作
2021/02/05 Python
《放飞蜻蜓》教学反思
2014/04/27 职场文书
生态养殖创业计划书
2014/05/06 职场文书
拉歌口号大全
2014/06/13 职场文书
因公司原因离职的辞职信范文
2015/05/12 职场文书
源码解读Spring-Integration执行过程
2021/06/11 Java/Android
Python pandas读取CSV文件的注意事项(适合新手)
2021/06/20 Python
vue如何实现关闭对话框后刷新列表
2022/04/08 Vue.js