Question

我在html中使用表单，使用angular，并绑定用户的用户名和电子邮件ID。

我希望将特定用户的详细信息显示在服务器页面上，当用户点击前端的提交详细信息时，数据被“绑定”并且信息同时显示在服务器页面上。 / p>

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>


<link href='https://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

<title>Random title here</title>

<body ng-app="test" ng-controller="mainctrl as ctrl">
<div class="container">
<div class="col-sm-8 col-sm-offset-2">
<form name="userform" ng-submit="ctrl.submit()">
<div class="form-group"> 
<label> Name</label>
<input type="text" name="name" class="form-ctrl" ng-model="ctrl.user.name">

</div>
<div class="form-group">
<label> Email id</label>
<input type="email" name="email" class="form-ctrl" ng-model="user.email">

</div>

<button type="submit" class="btn btn-primary"> Submit </button>

</form>
</div>
</div>


<script>
var test=angular.module('test',[]);
test.controller('mainctrl',[function($scope,$html){
$scope.user={};
$scope.submit= function () { 
    $http({
        method : 'POST',
        url : 'test1.java', //No idea what to put here. Help pls.
        data : $scope.user;
    headers : {'Content-Type':'application/x-www-form-urlencoded'}
    }).success(function(data)
            {
        console.log("Success");
            });
}
}]);

</script>
</body>
</html>

这只是我输入的代码示例。作为初学者，任何帮助将不胜感激。感谢。

Answer 1

如果您使用-Double.MAX_VALUE语法，则应使用参考1编写函数。您的控制器代码段就像

controller as

并传递this指令中的表单元素。像

angular.module('test',[])
  .controller('mainctrl',[function($scope, $http){
    var cm = this;
    cm.user={};
    cm.submit= function () { 
      $http({
          method : 'POST',
          url : form.attributes['target'], 
          data : cm.user;
      }).success(function(data)
            {
        console.log("Success");
            });
    }
}]);

Answer 2

我希望我的代码对您有用！

查看：

<body ng-controller="UserDataController">
<form ng-submit="sendData(user)">
    <input type="text" placeholder="name" ng-model="user.name" />
    <input type="text" placeholder="second name" ng-model="user.second_name" />
    <button type="submit" class="btn btn-sm btn-primary">
                Save
    </button>
</form >

Cotroller：

angular.module('httpExample', [])
    .controller('UserDataController', ['$scope', '$http', function($scope, $http) {
        $scope.user = {};

        $scope.sendData= function(user) {
            $http.post("/SomeUrl", user).success(function(data, status) {
                console.log(data);
                console.log(status);

                $scope.data = data; 
                // now you can write {{data}} at your veiw
                // example {{data.id}}
            });
      }]);

示例：获取request

使用$ http在服务器上显示角度的表单数据

2 个答案: