2017-12-15 9 views
-1

저는 Angularjs 응용 프로그램을 만들고 있으며 메시지를 가져오고 편집 할 때 모든 것이 잘 작동하도록했습니다. 이제 새로운 기능과 삭제 기능을 추가하고 싶습니다.HttpPost 데이터가 넘어 오지 않습니다.

나는 SkillsController라는 이름의 컨트롤러가 있습니다

[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; 
     }); 
    } 
} 
} 

을 그리고 나는 skillsCtrl.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')); 

가 나는 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')); 

skillNewCtrl.js 파일 :

(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')); 

이 호출은, 내가 컨트롤러의 업데이트 방법에서 제대로 형성 스킬 개체를 얻을 잘 작동 : 작성 방법을 잘 호출되는

  apiService.post('/api/skills/update/', $scope.EditedSkill, 
      createSkillCompleted, 
      createSkillLoadFailed); 

하지만, 기술 객체가 null :

  apiService.post('/api/skills/create/', $scope.newSkill, 
      createSkillCompleted, 
      createSkillLoadFailed); 

나는 이것이 많이해야한다는 것을 알고 있지만, 나는이 문제에 4 시간 동안 고개를 치고 있었다. 나는 모든 것을 시도했다.

+0

의 가장 큰 차이점은 편집 기술은 부하 기능에서 실제 기술 오브젝트 것입니다. 새로운 스킬은 json 객체로 정의됩니다. 어떻게 그들 사이의 매핑을합니까? – NickV

+0

편집 화면의 편집 오류는 표시되지만 새 화면의 오류는 표시되지 않습니다. 그게 뭐야? 저는 앵귤러를 처음 접했습니다. – NickV

+0

[ "JSON 개체"같은 것이 없습니다.] (http://benalman.com/news/2010/03/theres-no-suchthing-as-a-json/) JSON은 문자열 표기법입니다. 객체를 나타내는 데는 아무 것도 없습니다. – Amy

답변

0

당신은 변경할 수 :

public HttpResponseMessage Create(HttpRequestMessage request, Skill skill) 

에 :

public HttpResponseMessage Create(HttpRequestMessage request, [FromBody] Skill skill)