angularJS 发起$http.post和$http.get请求

AngularJS发起$http.post请求

代码如下：

$http({  
    method:'post',  
    url:'post.php',  
    data:{name:"aaa",id:1,age:20}  
}).success(function(req){  
    console.log(req);  
})  

这时候你会发现收不到返回的数据，结果为null，这是因为要转换成form data。 
解决方案：

• 配置$httpProvider：

var myApp = angular.module('app',[]);  
 myApp.config(function($httpProvider){  

   $httpProvider.defaults.transformRequest = function(obj){  
     var str = [];  
     for(var p in obj){  
       str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));  
     }  
     return str.join("&");  
   }  

   $httpProvider.defaults.headers.post = {  
        'Content-Type': 'application/x-www-form-urlencoded'  
   }  

});  

 angular.module("base", [])

   .base.factory("$jsonToFormData",function() {
    function transformRequest( data, getHeaders ){
        var headers = getHeaders();
        headers["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8";
        if(typeof( data )=="string"){
            return data;
        }
        return $.param(data);
    }
    return( transformRequest );
}).service('baseService', ['$http','$q','$jsonToFormData', function($http,$q,$jsonToFormData) {var service = {
            /**
             * get请求，输入url。
             * 调用方法：
             * var def=baseService.get(url);
             * def.then(
             *     function(data){},
             *     function(){});
             */
            get:function(url){
                var deferred = $q.defer();
                $http.get(url).success(function(data,status){
                    deferred.resolve(data);
                })
                .error(function(data,status){
                    deferred.reject(status);
                });
                return deferred.promise;
            },
            /**
             * 数据使用表单键值对的方式提交。
             * 在post数据时使用www-form-urlencoded方式提交。
             * 发送数据方式：
             * 1.构建键值对
             *     var str="name=tony&age=19";
             *  postForm(user,str);
             * 2.构建简单json对象
             *  var obj={name:"tony",age:19};
             *  postForm(user,obj);
             *  
             *  数据处理方式：
             *  var obj=baseService.postForm(url,params);
             *  obj.then(
             *      //调用成功时处理，服务器返回状态为200时。
             *      function(data){
             *      },
             *      //调用失败时处理，服务器返回状态 为400或500.
             *         function(status){
             *  });
             *  
             */
            postForm:function(url,param){
                var deferred = $q.defer();
                $http.post(url,param,{transformRequest:$jsonToFormData})
                 .success(function(data,status){
                     deferred.resolve(data);
                 })
                 .error(function(data,status){
                     deferred.reject(status);
                 });
                 return deferred.promise;
            },
            /**
             * 将数据直接post到指定的URL。
             * 服务端接收方法：
             * 1.复杂对象。
             * var obj={name:"zyg",age:"19",friends:[{name:"laoli",sex:"male"},{name:"tony",sex:"male"}]};
             * 使用：
             * public void demo1(HttpServletRequest request,

                 HttpServletResponse response,@RequestBody User user) throws IOException 
             * 2.直接读取流的方式。
             *     String str=FileUtil.inputStream2String(request.getInputStream());
             *    User user= JSONObject.parseObject(str, User.class);
             */
            post:function(url,param){
                var deferred = $q.defer();
                $http.post(url,param)
                 .success(function(data,status){
                     deferred.resolve(data);
                 })
                 .error(function(data,status){
                     deferred.reject(status);
                 });
                 return deferred.promise;
            }
        }
    return service;
}])

• 或者在post中配置

$http({  
   method:'post',  
   url:'post.php',  
   data:{name:"aaa",id:1,age:20},  
   headers:{'Content-Type': 'application/x-www-form-urlencoded'},  
   transformRequest: function(obj) {  
     var str = [];  
     for(var p in obj){  
       str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));  
     }  
     return str.join("&");  
   }  
}).success(function(req){  
       console.log(req);  
})  

AngularJS发起$http.post请求

代码如下：

    app.controller('sprintCtrl', function($scope, $http) {
            $http.get("http://localhost:8080/aosapp/pt/service?formid=pt_aosapp_service_sprintlist&teamid=1")
            .success(function (response) {console.log($scope.sprintlist=response);});
        });

其实，angularjs 和 jquery js最大的区别在哪儿那，angularjs是你事先在心中构建好真个页面，然后用变量或者占位符来表示数据，数据来了，直接填充就可以了；而jquery则是动态的修改dom元素，如添加修改dom标签等。设计思想不一样。

 

 

转载于:https://my.oschina.net/u/2332233/blog/1620275