为什么Angularjs POST请求后Angular Web API后端控制器中的数据始终为空?

问题描述 投票:0回答:1

我是angular的新手,试图搜索许多帖子,但是在js帖子发布后,没有一个帮助我以控制器方法接收数据。有谁知道为什么即使angularjs post发送数据,模型对象的参数也为空?

这是我在chrome调试器中找到的请求有效负载,因此,我认为一切都正确了。.

{Name: "MyName"}
Name: "MyName"

FrontEnd:

   <div id="divMain" ng-app="testCtrl">
    <div id="divTblForm" class="border" ng-controller="ButtonsController">
       <input id="btnTest" class="inptSubmit right roundBorder" type="button" value="Test" ng-click="test()" />
    </div>
   </div>

这是javascript(我尝试将objToSearch中的属性名称加成字符串,但不加成字符串,但不加成字符串,等等)。

function getAngularApp() {
      return angular.module('testCtrl', []);
    }
app.controller('ButtonsController', function ($scope, $http) {
  $scope.test = function () {

    var objToSearch = {
      Name: 'MyName'
    }

    $http.post("TestAngular/Test", JSON.stringify(objToSearch),
      {
        headers: {
          "Content-Type": "application/json"
        }
      }
    ).success(function (response) {
      alert(response)
    })
      .error(function (error) {
        alert(error);
      });
  }
});

后端:我尝试了是否使用FromBody属性,但都没有成功。.

 [RoutePrefix("TestAngular")]
    public class TestAngularController : Controller
    {
        [System.Web.Http.Route("Test")]
        [System.Web.Http.HttpPost]
        public List<Test> Test([System.Web.Http.FromBody]Test test)
        {
//breakpoint here, parameter 'test' values always empty or null..
            return null;
        }
    }

这是模型类

public class Test
{
    public string Name { get; set; }

}

有人可以帮忙吗?我已经花了四个多小时来搜索相似的主题并进行尝试。变得非常生气。 :(

javascript angularjs post asp.net-core-webapi
1个回答
0
投票

我修改了AngularJS代码以使用$http.post发布数据,该数据可以正常工作。

在AngularJS客户端上

<script>
    function getAngularApp() {
        return angular.module('testCtrl', []);
    }

    var app = getAngularApp();

    app.controller('ButtonsController', function ($scope, $http) {
        $scope.test = function () {

        var objToSearch = {
            Name: 'MyName'
        }

        $http.post("/TestAngular/Test", JSON.stringify(objToSearch),
            {
            headers: {
                "Content-Type": "application/json"
            }
            }
        ).then(function successCallback(response) {
            //code logic here
            console.log("success");
        }, function errorCallback(response) {
            console.log("error");
        });
        }
    });
</script>

测试结果

enter image description here

要解决此问题,您可以使用邮递员等工具对具有相同测试数据的请求进行检查,并检查控制器操作是否可以接收您发送的数据。如果可能的话,您可以创建一个新项目来实现相同的功能,然后检查新项目是否可以正常工作。

© www.soinside.com 2019 - 2024. All rights reserved.