【AngularJS系列】记一次post请求的坑

AngularJS免不了和web服务端交互，贴一段代码

$rootScope.ajaxRequestPost = function (requestUrl, data, successCallback) {
    var transFn = function (data) {
        return $.param(data);
    };
    var postCfg = {
        headers: {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},
        transformRequest: transFn
    };

    $http.post(requestUrl, data, postCfg).success(function (resultJson) {
        if (resultJson.success) {
            //回调业务
            successCallback(resultJson);
        }
    }).error(function (e) {
        console.log('系统异常');
    });
};

注意，在使用$http 提交请求时，配置了postCfg，其内部用了jquery.param方法，贴一段w3school上对该方法的说明：
param() 方法创建数组或对象的序列化表示。该序列化值可在进行 AJAX 请求时在 URL 查询字符串中使用

[img]http://dl2.iteye.com/upload/attachment/0118/1513/5316310d-166e-3bf5-b745-b340cefc528c.png[/img]

注意到，如果提交的参数就是简单的表单，一切OK。例如常用的SpringMVC举例
比如

class A{
    String xx;
}

public CommonResult update(HttpServletRequest request,HttpServletResponse response, @ModelAttribute A a) {

}

但是一旦A变成了复杂对象，其Jquery特有的序列化方式，将后导致后端处理时的异常：

class A{
   B b；
}
class B{
   String xx；
}

这时候该怎么办呢，解决方案如下：
1 修改post方法，采用angularJS默认方法： $http.post(requestUrl, data)
2 修改后端方法，采用@RequestBody
public CommonResult update(HttpServletRequest request,HttpServletResponse response, @RequestBody A a) {

}

实际上的不同就是，前者提交时，任是以key-value的形式提交；而后者提交时，直接将A的json串放在了body中了

至于ModelAttribute 和 RequestBody 注解有什么不同，百度一下