使用AngularJS post将对象列表传递给MVC操作方法_Angularjs_Asp.net Mvc

使用AngularJS post将对象列表传递给MVC操作方法

angularjs asp.net-mvc

使用AngularJS post将对象列表传递给MVC操作方法,angularjs,asp.net-mvc,Angularjs,Asp.net Mvc,我的行动方法如下所示： [HttpPost] public ActionResult Ask(Question question) { if (ModelState.IsValid) { TempData["NewQuestion"] = question; return RedirectToAction("Submit"); } return View(questio

我的行动方法如下所示：

[HttpPost]
    public ActionResult Ask(Question question)
    {
        if (ModelState.IsValid)
        {
            TempData["NewQuestion"] = question;
            return RedirectToAction("Submit");
        }
        return View(question);
    }

public class Question    
{
    public int Id { get; set; }
    public string Title { get; set; }
    public string Body { get; set; }
    public string UserId { get; set; }
    public List<Tag> Tags { get; set; }
    public int Votes { get; set; }
    public List<Answer> Answers { get; set; }
    public int Views { get; set; }
    public DateTime CreationDate { get; set; }
}

<script>
        function questionController($scope, $http) {            
            $scope.submit = function () {                
                var data = $.param({
                    Title: $scope.title,
                    Body: $scope.body,
                    Tags: [$.param({ TagName: 'MVC' }), $.param({ TagName: 'WCF' })]
                });
                var config = {
                    headers: {
                        'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
                    }
                };
                $http.post('Ask', data, config)
                    .success(function (data, status, headers, config) {
                        $scope.PostDataResponse = data;
                    })
                    .error(function (data, status, header, config) {
                        alert(data);
                    });
                };
        }
        var queApp = angular.module("queApp", []);
        queApp.controller("queCtrl", questionController);
    </script>

问题

类定义如下：

[HttpPost]
    public ActionResult Ask(Question question)
    {
        if (ModelState.IsValid)
        {
            TempData["NewQuestion"] = question;
            return RedirectToAction("Submit");
        }
        return View(question);
    }

public class Question    
{
    public int Id { get; set; }
    public string Title { get; set; }
    public string Body { get; set; }
    public string UserId { get; set; }
    public List<Tag> Tags { get; set; }
    public int Votes { get; set; }
    public List<Answer> Answers { get; set; }
    public int Views { get; set; }
    public DateTime CreationDate { get; set; }
}

<script>
        function questionController($scope, $http) {            
            $scope.submit = function () {                
                var data = $.param({
                    Title: $scope.title,
                    Body: $scope.body,
                    Tags: [$.param({ TagName: 'MVC' }), $.param({ TagName: 'WCF' })]
                });
                var config = {
                    headers: {
                        'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
                    }
                };
                $http.post('Ask', data, config)
                    .success(function (data, status, headers, config) {
                        $scope.PostDataResponse = data;
                    })
                    .error(function (data, status, header, config) {
                        alert(data);
                    });
                };
        }
        var queApp = angular.module("queApp", []);
        queApp.controller("queCtrl", questionController);
    </script>

公开课问题
{
公共int Id{get；set；}
公共字符串标题{get；set；}
公共字符串体{get；set；}
公共字符串用户标识{get；set；}
公共列表标记{get；set；}
公共整数投票{get；set；}
公共列表答案{get；set；}
公共int视图{get；set；}
公共日期时间创建日期{get；set；}
}

我编写的调用上述给定操作方法的代码如下所示：

[HttpPost]
    public ActionResult Ask(Question question)
    {
        if (ModelState.IsValid)
        {
            TempData["NewQuestion"] = question;
            return RedirectToAction("Submit");
        }
        return View(question);
    }

public class Question    
{
    public int Id { get; set; }
    public string Title { get; set; }
    public string Body { get; set; }
    public string UserId { get; set; }
    public List<Tag> Tags { get; set; }
    public int Votes { get; set; }
    public List<Answer> Answers { get; set; }
    public int Views { get; set; }
    public DateTime CreationDate { get; set; }
}

<script>
        function questionController($scope, $http) {            
            $scope.submit = function () {                
                var data = $.param({
                    Title: $scope.title,
                    Body: $scope.body,
                    Tags: [$.param({ TagName: 'MVC' }), $.param({ TagName: 'WCF' })]
                });
                var config = {
                    headers: {
                        'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
                    }
                };
                $http.post('Ask', data, config)
                    .success(function (data, status, headers, config) {
                        $scope.PostDataResponse = data;
                    })
                    .error(function (data, status, header, config) {
                        alert(data);
                    });
                };
        }
        var queApp = angular.module("queApp", []);
        queApp.controller("queCtrl", questionController);
    </script>


函数questionController（$scope，$http）{
$scope.submit=函数（）{
变量数据=$.param({
Title:$scope.Title，
Body:$scope.Body，
标记：[$.param（{TagName:'MVC'}），$.param（{TagName:'WCF'}）]
});
变量配置={
标题：{
“内容类型”：“application/x-www-form-urlencoded；charset=utf-8；”
}
};
$http.post（'Ask'，data，config）
.success（函数（数据、状态、标题、配置）{
$scope.PostDataResponse=数据；
})
.错误（功能（数据、状态、标题、配置）{
警报（数据）；
});
};
}
var queApp=angular.module（“queApp”，[]）；
queApp.controller（“queCtrl”，questionController）；

正在调用操作方法，但作为列表的

标记成员作为null
接收。请告诉我我做错了什么。
尝试将内容类型
值更改为应用程序/json

<script>
    function questionController($scope, $http) {            
        $scope.submit = function () {                
            var data =  {
                Title: $scope.title,
                Body: $scope.body,
                Tags: [{ TagName: 'MVC' }, { TagName: 'WCF' }]
            };
            var config = {
                headers: {
                    'Content-Type': 'application/json;charset=utf-8;'
                }
            };
            $http.post('Ask', data, config)
                .success(function (data, status, headers, config) {
                    $scope.PostDataResponse = data;
                })
                .error(function (data, status, header, config) {
                    alert(data);
                });
            };
    }
    var queApp = angular.module("queApp", []);
    queApp.controller("queCtrl", questionController);
</script>


函数questionController（$scope，$http）{
$scope.submit=函数（）{
风险值数据={
Title:$scope.Title，
Body:$scope.Body，
标记：[{标记名：'MVC'}，{标记名：'WCF'}]
};
变量配置={
标题：{
“内容类型”：“应用程序/json；字符集=utf-8；”
}
};
$http.post（'Ask'，data，config）
.success（函数（数据、状态、标题、配置）{
$scope.PostDataResponse=数据；
})
.错误（功能（数据、状态、标题、配置）{
警报（数据）；
});
};
}
var queApp=angular.module（“queApp”，[]）；
queApp.controller（“queCtrl”，questionController）；
尝试将内容类型
值更改为应用程序/json

<script>
    function questionController($scope, $http) {            
        $scope.submit = function () {                
            var data =  {
                Title: $scope.title,
                Body: $scope.body,
                Tags: [{ TagName: 'MVC' }, { TagName: 'WCF' }]
            };
            var config = {
                headers: {
                    'Content-Type': 'application/json;charset=utf-8;'
                }
            };
            $http.post('Ask', data, config)
                .success(function (data, status, headers, config) {
                    $scope.PostDataResponse = data;
                })
                .error(function (data, status, header, config) {
                    alert(data);
                });
            };
    }
    var queApp = angular.module("queApp", []);
    queApp.controller("queCtrl", questionController);
</script>


函数questionController（$scope，$http）{
$scope.submit=函数（）{
风险值数据={
Title:$scope.Title，
Body:$scope.Body，
标记：[{标记名：'MVC'}，{标记名：'WCF'}]
};
变量配置={
标题：{
“内容类型”：“应用程序/json；字符集=utf-8；”
}
};
$http.post（'Ask'，data，config）
.success（函数（数据、状态、标题、配置）{
$scope.PostDataResponse=数据；
})
.错误（功能（数据、状态、标题、配置）{
警报（数据）；
});
};
}
var queApp=angular.module（“queApp”，[]）；
queApp.controller（“queCtrl”，questionController）；
您可以添加请求中发送的json吗？
标记的每个元素都应该作为对象发送{TagName:“…”}
我已将其更新为：标记：[{TagName:“MVC”}，{TagName:“WCF”}]，并且这些标记将作为两个对象的列表返回。但是，两个对象的标记名都为空。它不起作用。错误：“无效的JSON原语”。我更新了我的答案，请参考它。你能添加请求中发送的JSON吗？标记的每个元素都应该作为对象发送{TagName:“…”}
我已将其更新为：标记：[{TagName:“MVC”}，{TagName:“WCF”}]，并且标记将作为两个对象的列表重新显示。但是，两个对象的标记名都为空。它不起作用。错误：“无效的JSON原语”。我更新了我的答案，请参考。谢谢Dabbas！它成功了。我使用了上面给出的代码。然而，我不得不删除$.toJSON（正如你在最后一行中所建议的那样）。@gliese581g我更新了我的答案并删除了$.toJSON（
谢谢Dabbas！它成功了。我使用了你上面给出的代码。然而，我不得不删除$.toJSON（正如你在最后一行中所建议的那样）。@gliese581g我更新了我的答案并删除了$.toJSON（