Проверка формы Angularjs Как я могу получить значения внутри контроллера - PullRequest
Новая
       12

Проверка формы Angularjs Как я могу получить значения внутри контроллера

0 голосов
/ 23 сентября 2018

Это моя часть HTML 

    <form name="userForm" ng-submit="submitForm()" novalidate>

                        <!-- NAME -->
                        <div class="form-group" ng-class="{ 'has-error' : userForm.name.$invalid && !userForm.name.$pristine }">
                            <label>Name</label>
                            <input type="text" name="name" class="form-control" ng-model="user.name" required>
                            <p ng-show="userForm.name.$invalid && !userForm.name.$pristine" class="help-block">You name is required.</p>
                        </div>
  <button type="submit" ng-disabled="userForm.$invalid">Submit</button>
</form>

Контроллер 

 $scope.submitForm = function (userForm) {
        $scope.master = angular.copy(userForm);
        if ($scope.userForm.$valid) {
            debugger;
            console.log($scope.userForm.name);
            alert('our form is amazing');
            console.log($scope.userForm);
        }

    };

Вот почему я не могу получить значения из HTML в контроллер

Ответы [ 3 ]

0 голосов
/ 23 сентября 2018

Можете ли вы попробовать ниже код.я думаю, что вы забыли передать значение в событии кнопки

, если вы не хотите изменять свой код, вы можете найти значение текстового поля в $ scope.master (то же самое в вашем коде) 

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">

<form name="userForm" ng-submit="submitForm(user)" novalidate>

  <!-- NAME -->
  <div class="form-group" ng-class="{ 'has-error' : userForm.name.$invalid && !userForm.name.$pristine }">
    <label>Name</label>
    <input type="text" name="name" class="form-control" ng-model="user.name" required>
    <p ng-show="userForm.name.$invalid && !userForm.name.$pristine" class="help-block">You name is required.</p>
  </div>
  <button type="submit" ng-disabled="userForm.$invalid">Submit</button>
</form>

</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    
    $scope.submitForm = function (userForm) {
        $scope.master = angular.copy(userForm);
        if ($scope.userForm.$valid) {
            debugger;
            console.log($scope.userForm.name);
            alert(userForm.name)
            alert('our form is amazing');
            console.log($scope.userForm);
        }

    };
});
</script> 

</body>
</html>
0 голосов
/ 23 сентября 2018

НЕ определяйте параметр для функции.Используйте $ scope.user в контроллере, если вам нужно значение user, а для получения формы используйте $ scope.userForm в вашем контроллере. 

$scope.submitForm = function () {
   $scope.master = angular.copy($scope.userForm);
  .
  .
  .
}
0 голосов
/ 23 сентября 2018

В функции submitForm от ng-submit нет аргументов!И зарегистрируйте $ scope.user в submitForm () и посмотрите, что будет внутри!Если ничего не происходит, инициализируйте $ scope.user = {};вне submitForm ().Тогда вы можете получить внутри функции submitForm $ scope.user.name Надеюсь, это поможет!

...