web-dev-qa-db-ja.com

特定の基準に従ってangularjsで正規表現を使用してパスワード検証を追加するにはどうすればよいですか?

ユーザーが入力したパスワードを次の基準で検証したい:

パスワードは8文字以上で、1つの数字、1つの文字、1つの特殊文字を含む必要があります。

それのために私は次の正規表現を使用しました:

^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8,}$

私は自分のangularjsコードでこの式を以下のように試しました:

<md-input-container class="md-block" style="margin-top:0px;">
            <label>Password</label> <md-icon
                md-svg-src="/images/icons/ic_lock_black_24px.svg" class="name"></md-icon>
            <input type="password" ng-model="newUser.userPassword"
                name="userPassword" required 
                ng-pattern="^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8,}$">
            <div
                ng-messages="registerForm.userPassword.$error">
                <div ng-message="pattern">Password should be atleast 8 characters long
                    and should contain one number,one character and one special
                    character</div>
                <div ng-message="required">Password should be atleast 8 characters
                    long and should contain one number,one character and one special
                    character</div>
            </div>
            </md-input-container>

上記のコードでは、パスワードフィールドが空白でフォーカスが失われたときにエラーメッセージが表示されます。ユーザーが基準を満たさないパスワードを入力した場合、エラーメッセージは表示されません。

この問題を解決するにはどうすればよいですか?誰か助けてください。

9
PHPFan

私があなたの問題を理解する限り。コンソールを確認する字句エラーにより壊れている可能性があります。

Ng-patternの開始時と終了時にslashを忘れました。 ng-pattern="/^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8,}$/"を使用してください

私はあなたを助けるかもしれないプランクを作成しました。 https://plnkr.co/edit/qCjp6a?p=プレビュー

18
Ankit Pundhir

ほんの数メモ

1)上記には、1つの冗長な_$_が含まれています。 ng-pattern="/^(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*#?&])[A-Za-z\d@$!%*#?&]{8,}$/"である必要があります

2)先頭の_^_と末尾の_$_を削除しないでください。空白が入力されなくなります。

3)コントローラでパターンを定義したい場合

$scope.passwordStrength = /^(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*#?&])[A-Za-z\d@$!%*#?&]{8,}$/;および_<input ng-pattern="passwordStrength">_

しかし決して

$scope.passwordStrength = "/^(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*#?&])[A-Za-z\d@$!%*#?&]{8,}$/";

パターンは RegExp オブジェクトであり、文字列ではありません。

これがあなたの時間の節約に役立つことを願っています。

2
Adam Bubela