2017-02-09 12 views
0

ここでは、ユーザが入力したデータをangle関数に渡して、サーバに送ることができます。データは機能していません。代わりng-bind使用ng-model角度jsでオブジェクトを渡す

ng-bind="user.fname" --->ng-model="user.fname"

すべてのフォーム要素のためにこれを使用するの

var app = angular.module('myApp', []); 
 
      app.controller('myCtrl', function ($scope, $http) { 
 
        $scope.submitForm = function (data) { 
 
        console.log(data + " " + data.fname + " " + data.lname); 
 
        $http({ 
 
         method: 'POST', 
 
         url: "update", 
 
         data: data, 
 
         headers: {'Content-Type': 'application/x-www-form-urlencoded'} 
 
        }).success(function (result) { 
 
               console.log(result); 
 
        }); 
 
       } 
 
      });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script> 
 

 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
         <form name="update"> 
 
          <div class="form-group"> 
 
           <div class="col-lg-4 col-md-4"> 
 
            <label for=fname">First Name</label> 
 
           </div> 
 
           <div class="col-lg-8 col-md-8"> 
 
            <input type=text" class="form-control" id="fname" name="fname" placeholder="First Name" 
 
              ng-bind="user.fname" data-validation="required" data-validation-error-msg="First Name required"/> 
 
           </div> 
 
          </div> 
 
          <div class="form-group"> 
 
           <div class="col-lg-4 col-md-4"> 
 
            <label for="lname">Last Name</label> 
 
           </div> 
 
           <div class="col-lg-8 col-md-8"> 
 
            <input type=text" class="form-control" id="lname" name="lname" placeholder="Last Name" 
 
              ng-bind="user.lname" data-validation="required" data-validation-error-msg="Last Name required"/> 
 
           </div> 
 
          </div> 
 
          <div class="form-group"> 
 
           <div class="col-lg-4 col-md-4"> 
 
            <label for="submit" class="sr-only" >submit</label> 
 
           </div> 
 
           <div class="col-lg-8 col-md-8"> 
 
            <input type="submit" class="form-control btn btn-success" id="update" 
 
              ng-click="submitForm(user)" 
 
              name="submit" placeholder="Submit"/> 
 
           </div> 
 
          </div> 
 
         </form> 
 
        </div>

答えて

2

+0

はい正常に動作します。 – xrcwrn

+0

'$ scope.submitForm = function(){ console.log($ scope.u); $ HTTP({ 方法: 'POST'、 URLは "updatedProfile"、 paramsは:{U:$ scope.u} }) .then(関数(応答){ にconsole.log(応答)。 }); } '私はサーバに{fname、lname}を送信していますが、何を変更する必要がありますか? – xrcwrn

+0

' $ scope.u'には何がありますか?これを 'params:{u:$ scope.u} 'to' params:$ scope.u'と試してみてください。 –