javascript - 如何在Angular/Spring Boot应用程序的服务器端接收表单数据？

我有一个基于Spring Boot和Angular的应用程序。在那里，我有这个表格：

<form name="create-project">
    <div class="input-group">
        <input type="text" class="form-control" ng-model="project.name"
               placeholder="Project name">
      <span class="input-group-btn">
        <button class="btn btn-default" type="button"
                ng-click="createProject(project)">Create project</button>
      </span>
    </div>
</form>

createProject在控制器中定义。

[...]
.controller('projects', function($scope, $http) {
    $http.get('/resource/').success(function(data) {
        $scope.greeting = data;
    });
    $scope.createProject = function(project) {
        console.log("createProject called on the client side, project name: " +
            project.name);
        $http.post('/createProject', {name: project.name}).success(function(){
            console.log("createProject called successfully");
        });
    }
});

在服务器端，我有以下方法来处理createProject请求：

@SpringBootApplication
@RestController
public class MyApplication {
    [...]
    @RequestMapping(value="/createProject", method=RequestMethod.POST)
    public String createProject(final String name) {
        System.out.println("createProject, server side, name: " + name);
        return "";
    }
}

当我运行应用程序时，在项目名称字段中输入一些文本，然后按创建项目按钮，发生以下情况：


我在客户端（createProject called on the client side, project name:）上看到带有正确项目名称的日志消息。
在服务器日志中，我看到createProject, server side, name: null。


输入的项目名称未传递到服务器，或者不接受。

我该如何解决？ e。确保我可以在方法MyApplication.createProject中访问输入的项目名称？

最佳答案

您的JavaScript代码对我来说还不错。我认为您需要在@RequestBody中添加createProject()。目前，它正在检查URL中的名称值。例如/ createProject？name = John。相反，您正在做的是在请求正文中指定它。这就是为什么名称为null的原因。

@SpringBootApplication
@RestController
public class MyApplication {
    [...]
    @RequestMapping(value="/createProject", method=RequestMethod.POST)
    public String createProject(@RequestBody final String name) {
        System.out.println("createProject, server side, name: " + name);
        return "";
    }
}