Question

ng-show在表单上有ng-hide类，每当字段变为无效时，它应该删除该类并显示错误消息，但由于某种原因，它不起作用

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<form id="email-form" name="email-form" ng-controller="loginFormCtrl as ctrl" >
            <div>
                <input ng-model="user.name" ng-minlength="5" ng-maxlength="10" class="w-input username" id="name" type="text" placeholder="Enter your name" name="name" data-name="Name"  required>
                <span ng-show="email-form['name'].dirty && email-form['name'].$error.maxlength">too long!</span>
                <span ng-show="email-form.name.dirty && email-form.name.$error.minlength">too short!</span>
            </div>
            <div>
                <input ng-model="user.email" class="w-input" id="email" type="email" placeholder="Enter your email address" name="email" data-name="Email" required>
                <span ng-show="email-form['email'].dirty &&  email-form.email.$error.required">required</span>
                <span ng-show="email-form.email.dirty &&  email-form.email.$error.required">not an email</span>
            </div>
            <div class="w-row">
                <div class="w-col w-col-6 w-col-stack"><a class="button widebutton" ng-click="submit()" href="">Log In</a>
                </div>
                <div class="w-col w-col-6 w-col-stack"><a class="button widebutton"  href="" ng-click="go('/createaccount')">Sign Up</a>
                </div>
            </div>
        </form>

Answer 1

将您的表单名称name =“email-form”更改为name =“emailForm”。在documentation之后，你应该使用类似的东西：

<span ng-show="emailForm.email.$dirty && emailForm.email.$error.required">required</span>
<span ng-show="emailForm.email.$dirty && emailForm.email.$error.email">not an email</span>

与其他两个相同。

angular-ng-show在表单字段变为无效时不会删除ng-hide类

1 个答案: