$http有很多参数和调用方法，本文只记录比较常用的应用及参数。

$http 服务：只是简单封装了浏览器原生的XMLHttpRequest对象，接收一个参数，这个参数是一个对象，包含了用来生成HTTP请求的配置内容，这个函数返回一个promise对象，具有success和error方法。

$http服务的使用场景：

var promise = $http({

method:"post",        　　// 可以是get,post,put, delete,head,jsonp;常使用的是get,post

url:"./data.json", 　　   //请求路径

params:{'name':'lisa'},  //传递参数，字符串map或对象，转化成？name=lisa形式跟在请求路径后面

data:blob, 　　　　　　　　//通常在发送post请求时使用，发送二进制数据，用blob对象。

}).success(function(data){

//响应成功操作

}).error(function(data){

//响应失败（响应以错误状态返回）操作

})

then()函数：可以使用then()函数来处理$http服务的回调，then()函数接受两个可选的函数作为参数，表示success或error状态时的处理，也可以使用success和error回调代替：　

then(successFn, errFn, notifyFn),无论promise成功还是失败了，当结果可用之后， then都会立刻异步调用successFn或者

errFn。这个方法始终用一个参数来调用回调函数：结果，或者是拒绝的理由。
在promise被执行或者拒绝之前， notifyFn回调可能会被调用0到多次，以提供过程状态的
提示

promise.then(function(resp){

//响应成功时调用，resp是一个响应对象

}, function(resp) {

// 响应失败时调用，resp带有错误信息

});

then()函数接收的resp（响应对象）包含5个属性：　

1. data（字符串或对象）：响应体
2. status:相应http的状态码,如200
3. headers(函数)：头信息的getter函数，可以接受一个参数，用来获取对应名字的值
4. config(对象)：生成原始请求的完整设置对象
5. statusText:相应的http状态文本，如"ok"

或者使用success/error方法，使用

//成功处理
promise.success(function(data, status, headers, config){

// 处理成功的响应

});

// 错误处理

promise.error(function(data, status, headers, config){

// 处理非成功的响应

});

　　使用实例：

index.html

<!doctype html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>$http request test </title>

  <script src="../js/angular.js"></script>

  <script src="app.js"></script>

</head>

<body>

<div data-ng-app="myApp" data-ng-controller="myAppController" data-ng-init="loadData()">

  <table>

    <thead>

    <tr>

      <th>名称</th>

      <th>属性</th>

    </tr>

    </thead>

    <tbody>

    <tr data-ng-repeat="data in myData">

      <td>{{data.name}}</td>

      <td>{{data.attr}}</td>

    </tr>

    </tbody>

  </table>

</div>

</body>

</html>

　

app.js
var myHttpApp = angular.module("myApp",[]);

myHttpApp.controller("myAppController",function($q,$http,$scope){

    var deffer = $q.defer();

    var data = new Blob([{

        "name":"zhangsan"

    }])

    $scope.loadData = function(){

        var promise = $http({

            method:"post",

            url:"./data.json",

            cache: true

        }).success(function(data){

            deffer.resolve(data);

        }).error(function(data){

            deffer.reject(data);

        })

        promise.then(function(data){

            $scope.myData = data.data;

        })

        /*promise.success(function(data){

            $scope.myData = data;

        })*/

    }

})

　　data.json

[

  {"name":"zhangsan","attr":"China"},

  {"name":"lisa","attr":"USA"},

  {"name":"Bob","attr":"UK"},

  {"name":"Jecy","attr":"Jepan"}

]

　　结果：

调用then()函数时返回的resp对象：

　

AngularJS的$http服务的应用的更多相关文章

  1. AngularJs之六（服务）

    服务:AngularJS 中,服务是一个函数或对象,可在你的 AngularJS 应用中使用.AngularJS 内建了30 多个服务. 最常用的服务:$location  服务,  $http 服务 ...

  2. 让AngularJS的$http 服务像jQuery.ajax()一样工作

    让AngularJS的$http 服务像jQuery.ajax()一样工作 $http的post . 请求默认的content-Type=application/json . 提交的是json对象的字 ...

  3. Ⅳ.AngularJS的点点滴滴-- 服务

    服务(Angularjs很多方法都是服务组成的) 1.使用service方法创建的单例服务 <html> <script src="http://ajax.googleap ...

  4. 怎么理解angularjs中的服务？

    AngularJS中的服务其实就是提供一种方式抽取共用类库 比如说一些工具类方法,我们传统的做法就是自己写个 utility 类,把相关的工具方法填充到utility里面去,最后把utility类放到 ...

  5. AngularJS之使用服务封装

    AngularJS之使用服务封装可复用代码   创建服务组件 在AngularJS中创建一个服务组件很简单,只需要定义一个具有$get方法的构造函数, 然后使用模块的provider方法进行登记: / ...

  6. AngularJS 的异步服务测试与Mocking

    测试 AngularJS 的异步服务 最近,在做项目时掉进了 AngularJS 异步调用 $q 测试的坑中,直接躺枪了.折腾了许久日子,终于想通了其中的道道,但并不确定是最佳的解决方案,最后还是决定 ...

  7. AngularJS内建服务以及自定义服务的用法

    在AngularJS中, 服务是一个比较重要的部分,它是一个对象或者是函数,可以在你的AngularJS的应用中使用.接下来介绍几种比较常用的内建服务以及自定义服务的方法. [内建服务] (1)loc ...

  8. 【angularJS】Service服务

    AngularJS 中的服务是一个函数或对象.可以创建自己的服务,或使用内建服务. 内置服务 AngularJS 内建了30 多个服务. 1.  $location 服务,它可以返回当前页面的 URL ...

  9. angularJS(三)：服务(Service)、http

    一.服务 服务是一个函数或对象,可在你的 AngularJS 应用中使用. 可以创建自己的服务,或使用内建服务 $location 注意 $location 服务是作为一个参数传递到 controll ...

  10. angularjs provider 供应商服务

    今天学习了angularjs的provider的供应商服务,写了个例子(自定义供应商服务,也可使用angularjs内部提供的服务) var starterApp = angular.module(' ...

随机推荐

  1. java中包的应用

    Do2.java package mypack; class Do2 { public static void main(String[] args) { packa.Do3 d=new packa. ...

  2. Jade学习笔记

    初学nodejs,折腾过用handlebars做模板,后来隔了一段重新学习,用了jade,真心简洁……记录一些学习笔记,以备复习. jade是基于缩进的,所以tab与space不能混用: 属性的设置: ...

  3. 菜鸟做HTML5小游戏 - 翻翻乐

    记录下开放过程.做小游戏开发,又要跨平台,flash又不支持iPhone,html5是最好的选择. 先看看最后效果: 好了,开始demo. 1.准备工作: 图片素材(省略...最后代码一起打包) 了解 ...

  4. PHPexcel：多sheet上传和下载

    excel表格上传和下载,断断续续写了很久,赶紧记下来万一以后忘记就亏大了= = 数据库有三张表:

  5. k-means均值聚类算法（转）

    4.1.摘要 在前面的文章中,介绍了三种常见的分类算法.分类作为一种监督学习方法,要求必须事先明确知道各个类别的信息,并且断言所有待分类项都有一个类别与之对应.但是很多时候上述条件得不到满足,尤其是在 ...

  6. android 巧用finish方法

    在android应用开发中,我们从一个activity跳到另一个activity时,我么要用到Intent: eg:Intent intent = new Intent(A.this,B.class) ...

  7. Cisco Anyconnect Secure Mobility Client

    Backup 进入安装文件目录cd anyconnect-3.1.00495/binary 安装sudo./vpnsetup.sh 查看安装情况ps aux  |  grep  cisco 在搜索中, ...

  8. 分享注册AltiumDesignerLive官网账号注册方法教程

    在Altium中国注册Live账号时,Altium会要求填写一些个人信息来申请账号提交账号后,等很长一段时间都没有得到回复.于是选择另一种方法注册打开Altium在俄罗斯的网址 http://ru.a ...

  9. windows批处理命令教程

      批处理文件是无格式的文本文件,它包含一条或多条命令.它的文件扩展名为 .bat 或 .cmd.在命令提示下键入批处理文件的名称,或者双击该批处理文件,系统就会调用Cmd.exe按照该文件中各个命令 ...

  10. MVC3路由设置访问后缀 html jsp

     C# Code  12345678910111213141516171819202122232425262728293031323334353637383940414243444546   publ ...