Javascript HttpPost数据未发送过来
我正在创建一个Angularjs应用程序,并且在获取和编辑消息方面一切都很好。现在我想添加新功能和删除功能 我有一个名为SkillsController的控制器:Javascript HttpPost数据未发送过来,javascript,angularjs,asp.net-web-api,Javascript,Angularjs,Asp.net Web Api,我正在创建一个Angularjs应用程序,并且在获取和编辑消息方面一切都很好。现在我想添加新功能和删除功能 我有一个名为SkillsController的控制器: [Authorize(Roles = "Admin")] [RoutePrefix("api/skills")] public class SkillsController : ApiControllerBase { public SkillsController(IDataRepository dataRepository)
[Authorize(Roles = "Admin")]
[RoutePrefix("api/skills")]
public class SkillsController : ApiControllerBase
{
public SkillsController(IDataRepository dataRepository) : base(dataRepository)
{
}
[HttpGet]
[Route("get")]
public HttpResponseMessage Get(HttpRequestMessage request)
{
return CreateHttpResponse(request, () =>
{
List<Skill> skills = DataRepository.GetSkills();
return request.CreateResponse(HttpStatusCode.OK, skills);
});
}
[HttpPost]
[Route("update")]
public HttpResponseMessage Update(HttpRequestMessage request, Skill skill)
{
return CreateHttpResponse(request, () =>
{
HttpResponseMessage response = null;
if (!ModelState.IsValid)
{
response = request.CreateResponse(HttpStatusCode.BadRequest,
ModelState.Keys.SelectMany(k => ModelState[k].Errors)
.Select(m => m.ErrorMessage).ToArray());
}
else
{
DataRepository.UpdateSkill(skill);
response = request.CreateResponse(HttpStatusCode.OK);
}
return response;
});
}
[HttpPost]
[Route("create")]
public HttpResponseMessage Create(HttpRequestMessage request, Skill skill)
{
return CreateHttpResponse(request, () =>
{
HttpResponseMessage response = null;
if (!ModelState.IsValid)
{
response = request.CreateResponse(HttpStatusCode.BadRequest,
ModelState.Keys.SelectMany(k => ModelState[k].Errors)
.Select(m => m.ErrorMessage).ToArray());
}
else
{
response = request.CreateResponse(HttpStatusCode.OK);
}
return response;
});
}
}
}
apiService.post('/api/skills/update/', $scope.EditedSkill,
createSkillCompleted,
createSkillLoadFailed);
然后我有一个skillEditCtrl.js文件,它可以完美地工作:
(function (app) {
'use strict';
app.controller('skillEditCtrl', skillEditCtrl);
skillEditCtrl.$inject = ['$scope', '$modalInstance', '$timeout', 'apiService', 'notificationService'];
function skillEditCtrl($scope, $modalInstance, $timeout, apiService, notificationService) {
$scope.cancelEdit = cancelEdit;
$scope.updateSkill = updateSkill;
function updateSkill() {
apiService.post('/api/skills/update/', $scope.EditedSkill,
updateSkillCompleted,
updateSkillLoadFailed);
}
function updateSkillCompleted(response) {
notificationService.displaySuccess($scope.EditedSkill.SkillName + ' has been updated');
$scope.EditedSkill = {};
$modalInstance.dismiss();
}
function updateSkillLoadFailed(response) {
notificationService.displayError(response.data);
}
function cancelEdit() {
$scope.isEnabled = false;
$modalInstance.dismiss();
}
}
})(angular.module('appSkills'));
和一个skillsNewCtrl.js文件:
(function (app) {
'use strict';
app.controller('skillsCtrl', skillsCtrl);
skillsCtrl.$inject = ['$scope', '$modal', 'apiService', 'notificationService'];
function skillsCtrl($scope, $modal, apiService, notificationService) {
$scope.pageClass = 'page-skills';
$scope.loadingSkills = true;
$scope.Skills = [];
$scope.loadSkills = loadSkills;
$scope.createSkill = createSkill;
$scope.deleteSkill = deleteSkill;
$scope.openEditDialog = openEditDialog;
function loadSkills() {
$scope.loadingLevels = true;
apiService.get('/api/skills/get/', null,
skillsLoadCompleted,
skillsLoadFailed);
}
function createSkill() {
$modal.open({
templateUrl: 'scripts/spa/skills/newSkill.html',
controller: 'skillNewCtrl',
scope: $scope
}).result.then(function ($scope) {
}, function () {
});
}
function openEditDialog(skill) {
$scope.EditedSkill = skill;
$modal.open({
templateUrl: 'scripts/spa/skills/editSkill.html',
controller: 'skillEditCtrl',
scope: $scope
}).result.then(function ($scope) {
}, function () {
});
}
function skillsLoadCompleted(result) {
$scope.Skills = result.data;
$scope.loadingSkills = false;
}
function skillsLoadFailed(response) {
notificationService.displayError(response.data);
}
$scope.loadSkills();
}
})(angular.module('appSkills'));
(function (app) {
'use strict';
app.controller('skillNewCtrl', skillNewCtrl);
skillNewCtrl.$inject = ['$scope', '$modalInstance', '$timeout', 'apiService', 'notificationService'];
function skillNewCtrl($scope, $modalInstance, $timeout, apiService, notificationService) {
$scope.newSkill = { SkillId: 0, SkillName: "test" };
$scope.cancelCreate = cancelCreate;
$scope.createSkill = createSkill;
function createSkill() {
apiService.post('/api/skills/create/', $scope.newSkill,
createSkillCompleted,
createSkillLoadFailed);
}
function createSkillCompleted(response) {
notificationService.displaySuccess($scope.newSkill.SkillName + ' has been updated');
$modalInstance.dismiss();
}
function createSkillLoadFailed(response) {
notificationService.displayError(response.data);
}
function cancelCreate() {
$scope.isEnabled = false;
$modalInstance.dismiss();
}
}
})(angular.module('appSkills'));
此调用工作正常,我在控制器上的更新方法中获得了一个格式正确的技能对象:
[Authorize(Roles = "Admin")]
[RoutePrefix("api/skills")]
public class SkillsController : ApiControllerBase
{
public SkillsController(IDataRepository dataRepository) : base(dataRepository)
{
}
[HttpGet]
[Route("get")]
public HttpResponseMessage Get(HttpRequestMessage request)
{
return CreateHttpResponse(request, () =>
{
List<Skill> skills = DataRepository.GetSkills();
return request.CreateResponse(HttpStatusCode.OK, skills);
});
}
[HttpPost]
[Route("update")]
public HttpResponseMessage Update(HttpRequestMessage request, Skill skill)
{
return CreateHttpResponse(request, () =>
{
HttpResponseMessage response = null;
if (!ModelState.IsValid)
{
response = request.CreateResponse(HttpStatusCode.BadRequest,
ModelState.Keys.SelectMany(k => ModelState[k].Errors)
.Select(m => m.ErrorMessage).ToArray());
}
else
{
DataRepository.UpdateSkill(skill);
response = request.CreateResponse(HttpStatusCode.OK);
}
return response;
});
}
[HttpPost]
[Route("create")]
public HttpResponseMessage Create(HttpRequestMessage request, Skill skill)
{
return CreateHttpResponse(request, () =>
{
HttpResponseMessage response = null;
if (!ModelState.IsValid)
{
response = request.CreateResponse(HttpStatusCode.BadRequest,
ModelState.Keys.SelectMany(k => ModelState[k].Errors)
.Select(m => m.ErrorMessage).ToArray());
}
else
{
response = request.CreateResponse(HttpStatusCode.OK);
}
return response;
});
}
}
}
apiService.post('/api/skills/update/', $scope.EditedSkill,
createSkillCompleted,
createSkillLoadFailed);
Create方法调用得很好,但Skills对象为null:
apiService.post('/api/skills/create/', $scope.newSkill,
createSkillCompleted,
createSkillLoadFailed);
我知道这件事要经历很多,但我已经为这个问题绞尽脑汁4个小时了。我什么都试过了。你能改变一下吗:
public HttpResponseMessage Create(HttpRequestMessage request, Skill skill)
致:
最大的区别在于编辑的技能是加载函数中的实际技能对象。新技能被定义为json对象。如何在它们之间进行映射?另一个问题是编辑屏幕上显示的编辑错误,而不是新屏幕上显示的编辑错误。怎么回事?我是个新手。JSON是一种表示对象的字符串符号,仅此而已。你知道我所说的JSON对象是什么意思。我是个新手,不是傻瓜:)@NickV是可怕的,在这种情况下是错误的。如果你再也不去那里,你会过得更好。