Skip to content

wcurrie/ng-password-demo

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

13 Commits
 
 
 
 

Repository files navigation

Simple demo of a set of password strength validation rules using Angular.js. Play with the demo.

####How it works:

Each passord strength check rule is 'Rule' object consisting of a description and a function to check if the entered password passes the rule. For example:

new Rule('Contain a digit', function () {
    return $scope.password1.match(/[0-9]/);
})

The set of rules are stored in a javascript array and attached to the rules attribute of the angular $scope. The rule descriptions are bound into html using the ng-repeat directive on a list element:

<ul>
    <li ng-repeat="rule in rules">
        <i ng-class="rule.class()"></i>
        {{rule.description}}
    </li>
</ul>

Each password input field is bound to an angular model attribute in javascript using the ng-model attribute in html:

<input type="password" ng-model="password1"/>

Each time the user types a key into the input field the angular digest loop takes care checking if each password strength rule has passed by invoking the rule.class() method to see what css class should be attached to the rule icon. If the rule passes a tick is shown. If it fails a cross is shown.

About

Angular.js password strength validation demo

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published