All of us have seen , for choosing a password we need combination of special characters, Capital letter , small letters, digits etc to make it strong.
Here is the code snippets to achieve this.
<!DOCTYPE html>
<html>
<head>
<title>Strong Password for Angular UI Pages</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function ($scope) {
var strongRegularExp = new RegExp("^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#\$%\^&\*])(?=.{8,})");
var mediumRegularExp = new RegExp("^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})");
$scope.checkpwdStrength = {
"width": "150px",
"height": "25px",
"float": "right"
};
$scope.validationInputPwdText = function (value) {
if (strongRegularExp.test(value)) {
$scope.checkpwdStrength["background-color"] = "green";
$scope.userPasswordstrength = 'You have a Very Strong Password now';
} else if (mediumRegularExp.test(value)) {
$scope.checkpwdStrength["background-color"] = "orange";
$scope.userPasswordstrength = 'Strong password, Please give a very strong password';
} else {
$scope.checkpwdStrength["background-color"] = "red";
$scope.userPasswordstrength = 'Weak Password , Please give a strong password';
}
};
});
</script>
</head>
<body ng-app="myApp">
<div ng-controller="myCtrl" style="border:5px solid gray; width:800px;">
<div>
<h3>Strong Password for Angular UI Pages </h3>
</div>
<div style="padding-left:25px;">
<div ng-style="checkpwdStrength"></div>
<input type="password" ng-model="userPassword" ng-change="validationInputPwdText(userPassword)" class="class1" />
<b> {{userPasswordstrength}}</b>
</div>
<br />
<br />
<br />
</div>
</body>
</html>