javascript - 使用 UI Utils 进行 Angular 表单验证

Question

我希望验证表单并在没有表单错误的情况下禁用提交。我正在利用 UI Utils。电子邮件验证、密码匹配和密码消息有效，但提交无效。

<div class="modal-body" ng-controller="registerFormController">
    <div class="facebookButton">
        <div class="lucida">Sign In With Facebook</div>
    </div>

    <form ng-submit="processForm()" name="registerForm" name="password" class="registerForm">
        <input type="email" placeholder="Email" class="registerEmail block" ng-model="formData.email">

        <input type="password" placeholder="password" required class="registerPassword block" ng-model="formData.password">

        <input type="password" placeholder="password" name="password2" required ui-validate=" '$value==formData.password' " ui-validate-watch=" 'formData.password' "class="registerPassword2 block" ng-model="formData.password2">

        <span ng-show="registerForm.password2.$error.validator">Passwords do not match!</span>


        <button type="submit" class="create-account" ng-disabled="'!registerForm.$error.validator'">Create Account</button>
    </form>
</div>

如果需要 CodePen/PLNKR 或任何其他代码，我绝对可以提供。提前谢谢大家。

Answer 1

您需要将标记更改为:

<button type="submit" class="create-account" ng-disabled="registerForm.$invalid">Create Account</button>

您还需要从表单标记中删除它:

name="password"