$http的使用方式

$http是AngularJS中用于与服务器进行交互的API,它提供了一种简洁的接口来发送HTTP请求并处理响应。通过$http服务,可以轻松地发起GET、POST、PUT等HTTP操作,并能方便地处理响应数据。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

$http的使用方式

$http:是对原生的XMLHttpRequest对象的封装

var app = angular.module('myApp', []);
// 创建Controller,测试$http如何与服务器交互
app.controller("MyController", function ($scope, $http) {

    // 1 基本使用方式,只接受一个参数,config对象
     $http({
         // 设置目标url,通常不会是一个json文件,而是后台的php或者jsp文件,通过其查询数据
         url: "data/users.json",
         method: "get"
     }).success(function (data,status,headers,config) {
          // data 是返回数据
          $scope.users=data.users;
          // status 是响应状态代码
          // headers 是响应头处理函数
          console.log(headers("cache-control"));
          // config是完整的配置对象
      }).error(function (data,status,headers,config) {
         // 发生了错误。只要不在200-299之间,就认为发生了错误
          console.log(data);
      });

    // 2 then方法的使用
    $http({
        // 设置目标url,通常不会是一个json文件,而是后台的php或者jsp文件,通过其查询数据
        url: "data/users.json",
        method: "get"
    }).then(
        function (res) {
            // res是响应对象
            console.log(res);
            $scope.users=res.data.users;
        }, function (res) {
            // 发生了错误。只要不在200-299之间,就认为发生了错误
            console.log(res);
        });

   // 3 简写形式  get()/post()/delete()/put()/jsonp()/head()
    $http.get("data/users.json").success(function (data) {  //get方法返回的还是promise对象
        $scope.users=data.users;
    });
})
<!-- $http的使用-->
<ul>
    <li ng-repeat="user in users">
        姓名:{{user.name}}   
        年龄:{{user.age}}
    </li>
</ul>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值