оба myForm. $ valid & myForm. $ invalid не определены в угловой форме?

0

У меня есть форма с именем myform и я пытаюсь установить ng-disabled с помощью этого кода:

ng-disabled="myForm.$invalid"

но оба myForm.$invalid & myForm.$valid не определены. В чем проблема? Я проверил в консоли, и myForm правильно установлен в форму.

ОБНОВИТЬ

 <form id="commissionForm" name="myForm" class="form-horizontal">

            <div class="form-group">
                <div class="col-sm-8 col-md-8 col-lg-8 col-xs-8" />
                <div class="col-sm-2 col-md-2 col-lg-2 col-xs-2" >
                    <button name="NextBtn" id="NextBtn"
                            ng-class="{disabled:commissionForm.$invalid}"
                            ng-disabled="myForm.$invalid"
                            ng-click="nextBtnClicked()" class="btn btn-primary"
                            >Next</button>
                </div>
            </div>
 </form>
  • 1
    Можете ли вы показать больше кода? Как вы определили форму?
Теги:

2 ответа

2
Лучший ответ

Вам нужно изменить "myForm" на "commisionForm", чтобы он работал. Кроме того, ваша форма должна иметь по крайней мере один элемент, который привязывается к модели, используя ng-model. В противном случае проверка не будет срабатывать.

Пример рабочего кода:

var app = angular.module('myApp', []);
app.controller('myController', function($scope) {

});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myController">
  <form id="commissionForm" name="commissionForm" class="form-horizontal">
    <div>form $valid: {{commissionForm.$valid}}</div>
    <div>form $invalid: {{commissionForm.$invalid}}</div>
    <div>An input box with max length 5, to make the form invalid:</div>
    <input ng-maxlength="5" ng-model="somemodel"/>
    <div class="form-group">
      <div class="col-sm-8 col-md-8 col-lg-8 col-xs-8" />
      <div class="col-sm-2 col-md-2 col-lg-2 col-xs-2">
        <button name="NextBtn" id="NextBtn" ng-class="{disabled:commissionForm.$invalid}" ng-disabled="commissionForm.$invalid" ng-click="nextBtnClicked()" class="btn btn-primary">Next</button>
      </div>
    </div>
  </form>
</div>
0

Если вы хотите использовать угловую встроенную проверку формы, проверьте угловую документацию по директиве формы:

https://docs.angularjs.org/api/ng/directive/form

<form name="myForm" ng-controller="FormController" class="my-form">
  userType: <input name="input" ng-model="userType" required>
  <span class="error" ng-show="myForm.input.$error.required">Required!</span><br>
  <code>userType = {{userType}}</code><br>
  <code>myForm.input.$valid = {{myForm.input.$valid}}</code><br>
  <code>myForm.input.$error = {{myForm.input.$error}}</code><br>
  <code>myForm.$valid = {{myForm.$valid}}</code><br>
  <code>myForm.$error.required = {{!!myForm.$error.required}}</code><br>
 </form>

Обратите внимание, что атрибут имени формы должен отображаться в службах угловой проверки. Похоже, вы не изменили это в своем коде.

myForm не undefined потому что в соответствии с вашим кодом имя вашей формы является commissionForm не myForm. Из кода, который вы предоставили.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню