모든 입력 데이터를 각도로 입력하십시오.

입력 데이터를 각도로 게시하려하지만 입력 필드에서 데이터를 가져 오는 방법을 모르겠습니다.모든 입력 데이터를 각도로 입력하십시오.

as.controller('Test', function($scope, $http, $rootScope) 
    { 

     $scope.submitForm = function(isValid) { 
      if(isValid) 
      { 
       $http.post($rootScope.appUrl + '/nao/test', {"data": $scope.userForm}) 
       .success(function(data, status, headers, config) { 
        console.log(data); 
       }).error(function(data, status) { 

       }); 
      } 

     }; 
    });

게시물이 나는 버튼을 누르면 때 만들었지 만 전송되는 데이터는 다음과 같습니다된다 :

여기

<div ng-controller="Test"> 
<div class="container"> 
<div class="col-sm-9 col-sm-offset-2"> 

    <div class="page-header"><h1>Testar</h1></div> 

    <form name="userForm" ng-submit="submitForm(userForm.$valid)" novalidate> <!-- novalidate prevents HTML5 validation since we will be validating ourselves --> 
     <div class="form-group" ng-class="{'has-error' : userForm.name.$invalid && !userForm.name.$pristine, 'has-success' : userForm.name.$valid }"> 
      <label>Name</label> 
      <input type="text" name="name" class="form-control" ng-model="name" required> 
      <p ng-show="userForm.name.$invalid && !userForm.name.$pristine" class="help-block">Fel namn</p> 
     </div> 

     <div class="form-group" ng-class="{'has-error' : userForm.username.$invalid && !userForm.username.$pristine, 'has-success' : userForm.username.$valid && !userForm.username.$pristine}"> 
      <label>Username</label> 
      <input type="text" name="username" class="form-control" ng-model="user.username" ng-minlength="3" ng-maxlength="8"> 
      <p ng-show="userForm.username.$error.minlength" class="help-block">För kort</p> 
      <p ng-show="userForm.username.$error.maxlength" class="help-block">För långt</p> 

     </div> 

     <div class="form-group" ng-class="{'has-error' : userForm.email.$invalid && !userForm.email.$pristine, 'has-success' : userForm.email.$valid && !userForm.email.$pristine}"> 
      <label>Email</label> 
      <input type="email" name="email" class="form-control" ng-model="email"> 
      <p ng-show="userForm.email.$invalid && !userForm.email.$pristine" class="help-block">Ange korrekt e-post</p> 
     </div>  

     <button type="submit" class="btn btn-primary">Lägg till</button> 
    </form> 
</div> 
</div> 
</div>

내 컨트롤러 : 여기

내 HTML입니다

{"data":{"name":{},"username":{},"email":{}}}

모든 입력란에서 데이터를 가져 오는 방법은 무엇입니까? 내가 컨트롤러에서하는 것처럼 userForm을 참조해야합니까?

출처

2014-07-16 user500468

나는 한 번 더 $ 범위 객체를 생성하는 것이 좋습니다 - 처음에 비어있을 것입니다 :

<input type="text" name="name" class="form-control" ng-model="form.name" required>

후 :

$scope.form = {};

는 모든 필드가이 객체의 일부가 될 것입니다 오브젝트 $ scope.form에있는 모든 필드를 보내십시오.

jsFiddle : http://jsfiddle.net/krzysztof_safjanowski/QjNd6/

출처

2014-07-16 09:36:58

대단히 감사합니다 :-) – user500468

환영합니다 :) 제안 사항이 하나 더 있습니다. 모든 필드가 유효해질 때까지 보내기 버튼을 비활성화 할 수 있습니다. –

당신이 범위에서 NG 모델 변수가 있습니다

$scope.name 
$scope.user.username 
$scope.email

을 할 수 있습니다 사용자와이 접두사의 모든. angular.copy ($ scope.userForm)

출처

2014-07-16 09:30:03

이 모든 변수를 하나의 객체로 연결 한 다음 $ http.post와 함께 데이터가 포함 된 객체를 보낼 수 있습니까? – user500468

$ http.post ($ rootScope.appUrl + '/ nao/test')로'$ http.post ($ rootScope.appUrl + '/ nao/test', { "data": $ scope.userForm} "HTML"ng-model = "name"을'ng-model = "user.name"으로 바꾸면 더 좋은 해결책이 될 것이라고 생각합니다 : "test", { "data": angular.copy ($ scope.userForm)}) '이메일 입력과 동일하게 다음과 같이 $ http.post를 보냅니다 : $ http.post ($ rootScope.appUrl + '/ nao/test', { "data": angular.copy ($ scope.user)})' –

당신은이 수를 : 다음 아약스 $의 scope.user 대신 $ scope.userForm

나에 의해 복사되는 객체를 보낼 수

시도로 보내기 당신의 범위에있는 재산, 예를 들면 user. ng-model 값을 user.SOMETHING으로 설정하십시오. 이렇게하면 {data: $scope.user }처럼 모든 데이터가 들어있는 $scope.user을 쉽게 보낼 수 있습니다.

출처

2014-07-16 09:36:20 Meligy

모든 입력 데이터를 각도로 입력하십시오.

답변

관련 문제