用AngularJS往Web Api post的正确用法

最新发现用AngularJS+Web Api写代码,开发效率比MVC大大提高,于是准备全面转向AngularJS。迁移过程中,发现用AngularJS的$http.post和之前jQuery的写法略有区别,一直遇到各种小问题,比如服务器端什么参数都接收不到,或者接受到时间总是1900年。下面记录一下最终试验出来的正确写法,分2种情况,服务器端接受基本对象参数,和服务器端接受model对象类。

服务器端接受基本对象参数

客户端写法

$http.post('/api/foo/action', '"' + item.Id + '"')
                        .success(function (response) {
                        }).error(function (response) {
                        });

服务器端写法

[Route("action"), HttpPost]
public async Task<IHttpActionResult> DoAction([FromBody]string id)
{
    var result = await doAction(id);
    return Ok(result);
}

服务器端接受model对象参数

客户端写法

var data = new FormData();
data.append(“request”, JSON.stringify($scope.request));

$http.post("/api/foo/new", data, {
    transformRequest: angular.identity,
    headers: { 'Content-Type': undefined }
}).success(function (response) {
}).error(function (response) {
})

服务器端写法

        [Route("new"), HttpPost]
        public async Task<IHttpActionResult> CreateFoo()
        {
            var request = JsonConvert.DeserializeObject<FooRequest>(provider.FormData.Get("request"));
            var result = await handler.CreateAsync(request);
            return Ok(result);
        }

Comments

137 responses to “用AngularJS往Web Api post的正确用法”

Leave a Reply