0

我正在使用 angular js 指令，但它不工作可以知道我做错了什么我遵循 angular js 文档但不工作是否需要任何库是我的表单有问题。

登录视图.html

<form class="form-horizontal" name="user_form" novalidate ng-submit='login()'>
                <div class="modal-header">
                    <h3>Login</h3>
                </div>

                <div class="modal-body">
                    <div class="form-group">
                        <label for="login-Name" class="col-lg-3 form-label">User Name:</label>
                        <div class="col-lg-8">
                            <input type="email" class="form-control" id="login-Name" ng-model="user.username" name="login-Name" placeholder="User Name" required/>
                            <div class="error" ng-show="user_form.login-Name.$dirty && user_form.login-Name.$invalid">
                                <small class="error" ng-show="user_form.login-Name.$error.required">
                                    User name is required.
                                </small>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="login-Password" class="col-lg-3 form-label">Password:</label>
                        <div class="col-lg-8">
                            <input type="password" class="form-control" id="login-Password" ng-model="user.password" name="login-Password" placeholder="Password" ng-minlength=6 ng-maxlength=20 required/>
                            <div class="error" ng-show="user_form.login-Password.$dirty && user_form.login-Password.$invalid">
                                <small class="error" ng-show="user_form.login-Password.$error.required">
                                    Your Password is required.
                                </small>
                                <small class="error" ng-show="user_form.login-Password.$error.minlength">
                                    Your Password is required to be at least 6 characters
                                </small>
                                <small class="error" ng-show="user_form.login-Password.$error.maxlength">
                                    Your Password cannot be longer than 20 characters
                                </small>
                            </div>
                        </div>
                    </div>
                </div>


                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary">
                        <i class="icon-user icon-white"></i> Login
                    </button>
                </div>

            </form>
4

1 回答 1

0

您的代码中有 2 个错误。

第一个，您在字段 id（登录名和登录密码）中使用了 -。将它们替换为 _（login_Name 和 login_Password）。Angularjs 将它们视为减法运算符，并且不会在 ng-show 指令中返回要评估的对象。

对于用户名（电子邮件地址），您的错误将永远不会显示，因为只要字段不为空，$error.required 就会设置为 false，如果字段为空，则 $dirty 会设置为 false。您的 2 个条件不能同时为真。

对于密码，必填字段也有同样的问题，但如果您更改您的 ID，您的其他 2 个验证将起作用。

工作示例：Plunker

于 2013-11-13T16:52:42.977 回答