javascript - AngularJS 中的表单始终无效

Question

这看起来很微不足道，所以如果我错过了一些东西，我很抱歉，但我无法弄清楚。

我想启用在表单有效时使用 AJAX 发送数据的按钮，但该按钮始终处于禁用状态。

看看:

<form name="UserReg" novalidate>

        <div class="form-group">
            <input type="text" name="user_name"
                                data-ng-model="UserName"
                                ng-maxlength=20
                                placeholder="Name"
                                required />

            <div data-ng-messages="UserReg.user_name.$error"
                 data-ng-show="UserReg.user_name.$touched">

                 <div data-ng-messages-include="angular_app/validation/form_messages.html"></div>

            </div>
        </div>


       <div class="form-group" style="padding-top:20px;">
            <button type="button" name="add_user"
                                    class="top-menu-button"
                                    data-ng-click="AddUser()"
                                    ng-disabled="UserReg.$invalid">
                <i class="fa fa-plus fa-lg padding-r-5"></i> Add User
            </button>
        </div>

</form>

问题出在哪里？

Answer 1

首先，您应该将 ng-maxlength 的值括在双引号中。 其次，由于您在输入字段上有 required 属性，因此仅当输入字段具有某些值(在其中输入某些内容并且表单将变得有效)时，表单才会变得有效。

否则，如果不需要，请从输入字段中删除 required 属性。