0

angular jsディレクティブを使用していますが、機能していません。私が間違っていることを知っている人はいますか？angular jsのドキュメントに従っていますが、機能していません。

loginView.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) で使用しました。それらを _ (login_Name および login_Password) に置き換えます。Angularjs はそれらを減算演算子と見なし、ng-show ディレクティブで評価するオブジェクトを返しません。

ユーザー名 (電子メール アドレス) については、フィールドが空でなくなるとすぐに $error.required が false に設定され、フィールドが空の場合は $dirty が false に設定されるため、エラーは表示されません。2 つの条件が同時に真であることはできません。

パスワードについては、必須フィールドでも同じ問題がありますが、ID を変更すると、他の 2 つの検証が機能します。

施工例：プランカー

于 2013-11-13T16:52:42.977 に答える