Javascript ng文件上传功能未触发功能
我试图上传一个文件到我的服务器,比如,保存一个到数据库的路径和一个到文件夹的文件,因为我尝试了ng文件上传这里是我的代码Javascript ng文件上传功能未触发功能,javascript,asp.net-mvc,angularjs,angular-file-upload,Javascript,Asp.net Mvc,Angularjs,Angular File Upload,我试图上传一个文件到我的服务器,比如,保存一个到数据库的路径和一个到文件夹的文件,因为我尝试了ng文件上传这里是我的代码 <form ng-show="divPatient" name="PatientForm" ng-submit="AddUpdatePatient()"> <table> <tr> <td> <input class="form-control" type="text" readon
<form ng-show="divPatient" name="PatientForm" ng-submit="AddUpdatePatient()">
<table>
<tr>
<td>
<input class="form-control" type="text" readonly placeholder="Key (Automatic)" ng-model="PatientID" />
</td>
<td>
<input id="FormFocus" name="FirstName" class="form-control" type="text" placeholder="FirstName" ng-model="FirstName" ng-minlength="3" required />
</td>
<td>
<input name="LastName" class="form-control" type="text" placeholder="LastName" ng-model="LastName" ng-minlength="3" required />
</td>
<td>
<input class="form-control" type="text" placeholder="Disease" ng-model="Disease" name="Disease" ng-minlength="3" required />
</td>
<td>
<input class="form-control" type="number" placeholder="Phone No." ng-model="PhoneNo" name="PhoneNo" ng-pattern="/^[789]\d{9}$/" required />
</td>
<td>
<input type="file" ng-file-select="onFileSelect($files)" class="form-control" ng-model="PhotoURL" required />
</td>
<td colspan="2">
<input type="submit" value="save" class="btn btn-success" ng-disabled="PatientForm.PhoneNo.$dirty && PatientForm.PhoneNo.$invalid || PatientForm.LastName.$dirty && PatientForm.LastName.$invalid || PatientForm.FirstName.$dirty && PatientForm.FirstName.$invalid || PatientForm.Disease.$dirty && PatientForm.Disease.$invalid" />
<input type="button" value="cancel" class="btn btn-primary" ng-click="CancelForm()" />
</td>
</tr>
<tr>
<td></td>
<td><span class="eror-text" ng-show="PatientForm.FirstName.$error.minlength">min 3 letters</span></td>
<td><span class="eror-text" ng-show="PatientForm.LastName.$error.minlength">min 3 letters</span></td>
<td><span class="eror-text" ng-show="PatientForm.Disease.$error.minlength">min 3 letters</span></td>
<td><span class="eror-text" ng-show="PatientForm.PhoneNo.$error.pattern">Invalid phone no</span></td>
</tr>
</table>
</form>
我的依赖关系
bundles.Add(new ScriptBundle("~/bundles/CustomPlugins").Include(
"~/Scripts/ng-file-upload-shim.min.js",
"~/scripts/angular.min.js",
"~/Scripts/ng-file-upload.min.js"));
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/CustomPlugins")
我哪里出错了,请告诉我如何使用angularjs将文件上传到actionresult,谢谢
好的,我试过一次
onchange="angular.element(this).scope().selectFileforUpload(this.files)"
但我无法将该文件发送到我的操作结果,它显示为空
$scope.selectFileforUpload = function (files) {
$scope.selectedFile = files;
}
$scope.AddUpdatePatient = function () {
var file = $scope.selectedFile[0];
var Patient = {
FirstName: $scope.FirstName,
LastName: $scope.LastName,
Disease: $scope.Disease,
PhoneNo: $scope.PhoneNo
};
var getData = angularService.AddPatient(Patient,filee);
getData.then(function (msg) {
GetAllPatients();
alert(msg.data);
$scope.divPatient = false;
}, function () {
alert('Error in adding record');
});
}
这是我的服务代码
this.AddPatient = function (patient, file) {
// this showing me file object thats fine
alert("in services" + filee);
// i think something wrong here we shouldn't or can't send the file to actionresult like this
var response = $http({
method: "post",
url: "AddPatient",
data: JSON.stringify(patient),
dataType: "json",
file : file
});
return response;
}
我最后的行动结果
public string AddPatient(Patient patient,HttpPostedFileBase file)
{
// I'm getting patient data that is fine, but file is showing me null
}
我的服务方法有什么问题吗???或者你知道如何将表单和文件一起发送到actionresult或mvc控制器中的任何方法吗?我听说有些人使用“新表单数据”来发送表单,但我不知道,但我愿意学习或使用它,如果这解决了我的问题,就像Guinn在上面的评论中提到的那样,用于ng文件上载的“ng”不是代码中的那个 当使用错误的指令时,您看到的症状与我看到的完全一致 ng file upload git hb现在实际上包含一些fiddle,您可以在浏览器中验证这些fiddle,然后使用相同的语法确保实现正常工作:
源代码
,选择你的js文件,找到onflesect
函数并在其上放置一个中断
。然后尝试上载一个文件,查看函数是否执行根据ng file upload自述文件,您应该使用ngf change=fileSelected($file,$event)
而不是ng file selected
。您是否使用控制台进行调试以检查是否存在任何错误?因为如果您使用的是ng-。。。这是不承认的,它可能会完全断裂
public string AddPatient(Patient patient,HttpPostedFileBase file)
{
// I'm getting patient data that is fine, but file is showing me null
}