我的视图页面中有两个输入类型文件控件。一个用于阿凡达,另一个用于个人资料图片。我在后面的代码中获得了两个图像。 这是我的AngularJS控制器
var app = angular.module('ProfileModule', []);
app.controller('ProfileController',['$scope','$http', function ($scope,$http) {
$scope.user = {};
$scope.files = [];
var formData = new FormData();
$scope.LoadFileData = function (files) {
for (var file in files) {
formData.append("file", files[file]);
}
};
$scope.submit = function () {
$http({
url: "/Profiles/Edit",
method: "POST",
headers: { "Content-Type": undefined },
transformRequest: function (data) {
formData.append("user", angular.toJson(data.user));
//for (var i = 0; i < data.files.length; i++) {
// formData.append("files[" + i + "]", data.files[i]);
//}
return formData;
},
data: { user: $scope.user }
})
.success(function (response) { });
}
}]);
以下是两个控件
<input id="selector" type="file" onchange="angular.element(this).scope().LoadFileData(this.files)" accept="image/*">
<input id="selector" type="file" onchange="angular.element(this).scope().LoadFileData(this.files)" accept="image/*">
这是我的MVC控制器
public ActionResult Edit(string user, HttpPostedFileBase[] files)
{}
我在字符串中获取rest模型值,然后将其解析为模型但图像文件在文件中显示为null,因此我在Request.Files中获取它们。 我应该做什么编辑才能在阵列中获取该图像文件。
答案 0 :(得分:0)
您可以调整控制器操作以接受IEnumerable
HttpPostedFileBase
个实例:
public ActionResult Index(IEnumerable<HttpPostedFileBase> files)
如果要上传多个具有不同名称的文件字段,要使模型绑定器正确绑定它们,您的控制器操作签名应如下所示:
public ActionResult Create(HttpPostedFileBase avatar,
HttpPostedFileBase profile)
答案 1 :(得分:0)
您的输入类型文件控件都应该将名称属性设置为“profileImage”和“avatarImage”。然后像这样定义你的控制器动作:
[HttpPost]
ActionResult Edit (string user, HttpPostedFileBase profileImage, HttpPostedFileBase avatarImage)
{
...
}
和html:
<input id="selector" name="profileImage" type="file" onchange="angular.element(this).scope().LoadFileData(this.files)" accept="image/*">
<input id="selector" name="avatarImage" type="file" onchange="angular.element(this).scope().LoadFileData(this.files)" accept="image/*">
编辑:检查参数是否为非空并且您准备好了。
编辑:将用户参数添加到控制器操作。
编辑:添加了HTML代码。