Angularjs MVC模型绑定具有复杂类型集合属性的复杂类型

Angularjs MVC模型绑定具有复杂类型集合属性的复杂类型,angularjs,asp.net-mvc,model-binding,angular-http,complextype,Angularjs,Asp.net Mvc,Model Binding,Angular Http,Complextype,我正在使用AngularJS和ASP.NETMVC开发一个Web应用程序。但是我在模型绑定复杂类型时遇到了一个问题。我上传的文件列表,字符串列表基本上。在数据库中,它们(字符串列表和文件列表)是相同的列和表,因为我在上传文件后保存了路径。对于字符串,我使用文件路径保存同一列。例如,数据库表有Id(int)和Data(string)列 然后,我将AngularJS发布的字符串数据保存在数据列中,作为文件路径保存在数据列中。但问题是,我需要记住顺序。例如,用户添加一个文本字段,然后输入值,然后动态添

我正在使用AngularJS和ASP.NETMVC开发一个Web应用程序。但是我在模型绑定复杂类型时遇到了一个问题。我上传的文件列表,字符串列表基本上。在数据库中,它们(字符串列表和文件列表)是相同的列和表,因为我在上传文件后保存了路径。对于字符串,我使用文件路径保存同一列。例如,数据库表有Id(int)和Data(string)列

然后,我将AngularJS发布的字符串数据保存在数据列中,作为文件路径保存在数据列中。但问题是,我需要记住顺序。例如,用户添加一个文本字段,然后输入值,然后动态添加文件字段,然后选择文件,然后添加一个文本字段,然后再次输入值。因此,顺序必须是[“文本1值”,文件,“文本2值”]。但问题是,我们无法将HttpPostedFileBase(文件)和string(文本值)混合的数据列表绑定到一起。所以我所做的是创建视图模型,如下所示

    public class CreateBlogVM
    {
        [Required]
        [MaxLength(250)]
        public string Title { get; set; }
        [Required]
        public ContentModel[] TextContents { get; set; }
        [Required]
        public ContentFileModel[] Files { get; set; }
    }

    public class ContentModel
    {
        public int OrderNo { get; set; }
        public string Content { get; set; }
    }

    public class ContentFileModel
    {
        public int OrderNo { get; set; }
        public HttpPostedFileBase File { get; set; }
    }
正如您在上面看到的,CreateBlogVM将是我现在绑定的ViewModel。这个类将有两个复杂类型的属性——TextContents和文件,我在上面解释了我正在做的事情。所以为了记住顺序,我创建了一个带有OrderNo字段的复杂类型(客户机将传递这个值),正如您在上面看到的,因为我们不能像这样绑定数据列表

[HttpPostedFileBase, String, String, HttpPostedFileBase]
public JsonResult Create(HttpPostedFileBase files, String contents, String title)
但问题是,当我从Angular js发布数据时,所有值都为null,并且不绑定数据。只有“Title”值具有约束力

    var textContents = new Array();
    var photoContents = new Array();

    for(var i=0; i<$scope.rows.length; i++)
    {
        if($scope.rows[i].type=="text")
        {
            var value = $scope.rows[i].value;
            if (value == "" || value == null) {
                showAlert("Text field should not be empty", "danger");
                return;
            }
            else {
                var content = { OrderNo: i, Content: value }
                textContents.push(content)
            }
        }
        else if($scope.rows[i].type=="photo")
        {
            var file = $scope.rows[i].file;
            if(file==null)
            {
                showAlert("Photo file is required", "danger");
                return;
            }
            else {
                var content = { OrderNo: i, File: file };
                photoContents.push(file);
            }
        }
    }

    var fd = new FormData();
    fd.append('Title', $scope.title);
    fd.append("TextContents", textContents);
    fd.append("Files", photoContents);

    $http.post("/Admin/Blog/Create", fd, {
        transformRequest: angular.identity,
        headers: { 'Content-Type': undefined }
    })

    .success(function () {
    })

    .error(function () {
    });

但是如果我像上面那样绑定,我就不能对文件和字符串内容进行排序。那么我的代码有什么问题?如何绑定具有复杂类型对象属性列表的复杂数据?

更改模型,以便在
内容
和关联的
文件
之间建立直接关系(不需要
顺序
属性)

因此,您可以使用与集合属性相关的索引器生成名称(
文件[0]。内容
文件[0]。图像
文件[1]。内容
等)

然后您的POST方法签名将被删除

public JsonResult Create(CreateBlogVM model)

不能将对象数组(
textContents
)绑定到
字符串。但是为什么不只是一个具有
字符串内容
HttpPostedFileBase
的模型,然后主模型包含该模型的集合,以便将内容和文件关联在一起?并且您只能添加简单的
名称/值
对以形成数据,不是对象的集合。你是指字符串数组和HttpPostedFileBase数组?如果我使用旧方法,我可以将字符串集合与表单数据绑定。因为HttpPostedFileBase数组和字符串数组不合适,因为我需要将OrderNo与它们一起传递。非常感谢。这就是我所需要的。非常完美的答案。
var fd = new FormData();
fd.append('Title', $scope.title);
for (var i=0; i<$scope.rows.length; i++)
{
    ....
    var content = $scope.rows[i].value;
    fd.append('Files[' + i + '].Content', content);
    ....
    var file = $scope.rows[i].file;
    fd.append('Files[' + i + '].Image', file);
}
....
public JsonResult Create(CreateBlogVM model)