如何在Angular中使用Post方法获取

时间:2017-09-13 13:11:46

标签: angularjs http spring-mvc

  

无法使用mysql anglerJS和Spring控制器将数据插入数据库。给出400错误。试图谷歌它,但没有得到代码。所以我犯了错误

Controller.java

@RequestMapping(value="/insert",method=RequestMethod.POST)
public Emp insret(@RequestParam(value="user")String 
user,@RequestParam(value="pass1")String pass)
{
     Emp em=new Emp();
     em.setUser(user);
     em.setPass(pass);
     System.out.println(user+""+pass);
     return er.save(em);

}

post方法的角度文件

script1.js

   var app = angular.module("myApp", [])
        .controller("myCtrl", function ($scope, $http, $log) {

            $scope.abc = function () {
                $log.info($scope.user)
                $log.info($scope.pass1)// you will have your updated value here
                $http({
                method:'POST',
                url:     '/insert',

                data : {
                    'user' : $scope.user,
                    'pass':$scope.pass1
                },
                headers: {'Content-Type': 'application/x-www-form-urlencoded'}
            })
            .then(function (response) {
                 $scope.repos = response.data;
                 $log.info(response);
             });
        }
});

用于post方法的HTML文件中的嵌入角度。

index.html

   <!DOCTYPE html>
      <html>
        <head>
          <script 
     src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js">
    </script>
          <script type="text/javascript" src="script1.js"></script>
        </head>
          <body ng-app="myApp" >
            <div ng-controller="myCtrl">
               <form ng-submit="abc()">
                  <input type="text"  ng-model="user" />
                  <input type="text"  ng-model="pass1" />
                  <button type="submit">Test</button>
               </form>
            </div>
          </body>
      </html>

如果我使用此URL插入数据localhost:8080 / insert.But如果我使用  角度为400误差

`@RequestMapping(value="/insert")
  public Emp insret() 
 {
  Emp em=new Emp(); 
  em.setUser("etc"); 
  em.setPass("1234"); return er.save(em); 
 } 

1 个答案:

答案 0 :(得分:1)

正式回答:

@PostMapping(value="/insert",produces="application/json")
public Emp insret(@RequestBody Emp em){
 //do ....
 return er.save(em);
}

当你从Angular或其他客户发布数据时,这些数据都在请求的主体中,为什么Spring的人会引入这个注释。

@RequestParam用于检索请求参数值,在您的情况下,您希望:/insert?user=value1&pass1=value2,这不是您想要的。