我尝试使用表单然后使用angular(1.5.7)和C#将图像保存在服务器上以及有关它的一些信息。
我尝试了多种方式,传递给Api控制器的文件为空或模型状态无效。
你能告诉我我做错了什么吗?
我的C#控制器:
public class Data
{
public PartnersViewModel newPartner { get; set; }
public IFormFile file { get; set; }
}
}
数据类:
(function () {
"use strict";
// getting the existing module
angular.module("app-edit")
.controller("partnersController", partnersController);
function partnersController($http, $scope) {
var vm = this;
vm.partners = [];
vm.newPartner = {};
vm.errorMessage = "";
vm.isBusy = true;
var f = null;
$scope.add = function () {
f = document.getElementById('uploader').files[0];
if (f) {
alert("File attached succesfully");
}
};
$http.get("/api/partners").then(function (response) {
//success
angular.copy(response.data, vm.partners);
}, function () {
//failure
vm.errorMessage = "failed to load data";
})
.finally(function () {
vm.isBusy = false;
});
vm.addPartner = function () {
vm.isBusy = true;
vm.errorMessage = "";
var Indata = { 'newPartner': vm.newPartner, 'file': f };
$http.post("/api/partners", Indata)
.then(function () {
//success
vm.partners.push(response.data);
vm.newPartner = {};
}, function () {
//failure
vm.errorMessage = "Failed to save new partner";
})
.finally(function () {
vm.isBusy = false;
});
};
vm.removePartner = function (name) {
vm.isBusy = true;
vm.errorMessage = "";
$http.delete("/api/partners/" + name)
.then(function () {
//success
//vm.partners.shift();
//vm.newPartner = {};
vm.errorMessage = "Udało się usunąć partnera";
}, function () {
//failure
vm.errorMessage = "Nie udało się usunąć partnera";
})
.finally(function () {
vm.isBusy = false;
});
};
}
})();
角度控制器:
<div class="col-md-6 col-md-offset-3">
<div class="text-danger" ng-show="vm.errorMessage">{{ vm.errorMessage }}</div>
<wait-cursor ng-show="vm.isBusy"></wait-cursor>
<form novalidate name="newPartnerForm" method="POST" enctype="multipart/form-data" ng-submit="vm.addPartner()">
<div class="form-group">
<label for="name">Nazwa Partnera</label>
<input class="form-control" type="text" id="name" name="name" ng-model="vm.newPartner.name" required/>
<span ng-show="newPartnerForm.name.$error.required" class="text-warning">To pole jest wymagane</span>
</div>
<div class="form-group">
<label for="files">Ścieżka</label>
<input type="file" id="uploader" name="files[]" class="btn btn-primary" accept="image/*" ng-model="files" ngf-multiple="false">
<button ng-click="add()">Add</button>
</div>
<div class="form-group">
<label for="href">Link do strony partnera</label>
<input class="form-control" type="text" id="href" name="href" ng-model="vm.newPartner.href"/>
</div>
<div class="form-group">
<input type="submit" value="Add"
class="btn btn-success btn-sm"
ng-disabled="newPartnerForm.$invalid" />
</div>
</form>
<table class="table table-responsive table-striped">
<tr ng-repeat="partner in vm.partners">
<td> {{partner.name}}</td>
<td> {{partner.href}}</td>
<td><a ng-href="#/editor/{{ patner.name }}" class="btn btn-sm btn-primary">Manage</a></td>
<td><input type="button" ng-click="vm.removePartner(partner.name)" value="Usuń" class="btn btn-sm btn-danger"/></td>
</tr>
</table>
HTML文件:
isPositive
从表单传递似乎正在起作用,因为每当我选择文件时警报都会被触发。