如何使用spring mvc和angularJS插入数据答案

【问题标题】：How to insert data using spring mvc and angularJS如何使用spring mvc和angularJS插入数据
【发布时间】：2015-07-22 17:59:47
【问题描述】：

我想使用 AngularJS 和 spring mvc 将数据插入数据库，根据教程我做了所有事情，但我未能将数据插入数据库。

控制器：

       @RequestMapping(value = "/add", method = RequestMethod.POST)
          public @ResponseBody String addEmployee(@ModelAttribute(value="employee")EmployeeEntity employee, BindingResult result) 
{
    employeeManager.addEmployee(employee);
    return "redirect:/";
}

js代码：

  $scope.insertData = function(){
    $http.post("http://localhost:9090/CrudOperations/add", {"firstname":$scope.firstname})
    .success(function(data,status,header,config)
            {

                console.log("inserted");
            });

}

jsp:

   <form:form  class="form-horizontal" role="form" method="post"  commandName="employee">

<div class="form-group col-lg-7" >
  <label for="email" class="control-label">First Name:</label>
  <input type="text" ng-model="firstname" class="form-control"  placeholder="Enter Firstname"/>
</div>

<div class="form-group col-lg-7">
   <button type="submit" ng-click="insertData()" class="btn btn-primary">Submit</button>
</div>

【问题讨论】：

使用浏览器开发工具网络选项卡检查实际请求。在验证控制台中没有抛出异常后调试 ajax 时首先开始。需要状态，检查发送/返回的内容等。如果问题是客户端或服务器端，需要缩小范围

标签： angularjs spring-mvc

【解决方案1】：

您没有具体说明您的问题是什么以及您遇到了什么行为，但您的代码似乎有一些问题可以指出。

您似乎正在尝试混合两种与后端进行通信的方式 - 更传统的基于表单的方法和 Rest API。

使用@ResponseBody 注释您的控制器方法意味着Spring 不应该尝试解析要呈现的视图。相反，它应该使用消息转换器（通常 - 将其序列化为 JSON）转换从您的方法返回的对象，并将结果在响应正文中发送回客户端。这用于公开一个 Rest 端点。

这意味着返回字符串“redirect:/”不会导致重定向。相反，字符串将在正文中返回。

如果持久化实体的过程导致设置其 id，则返回可能由employeeManager.addEmployee(employee) 返回的持久化实体可能会更好。这样客户就可以收到该 ID 并在以后找到该员工。

如果您使用 JSON 将数据从 Angular 传递到后端，您可能还应该使用 @RequestBody 注释而不是 @ModelAttribute。这反过来将导致对象被反序列化。您没有显示您的 EmployeeEntity 类，所以我不知道这是否是您想要的。

在客户端，您可能不需要表单元素。 Angular 可以使用 AJAX 调用传递数据。拥有表单和提交按钮将导致您的浏览器重新加载页面，如果您正在创建单页应用程序，这不是您通常想要的。

【讨论】：