This code snippet helps us in choosing a strong password for AngularJS UI pages. 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.

Write the following code:

<!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>  

HostForLIFE.eu AngularJS Hosting

HostForLIFE.eu is European Windows Hosting Provider which focuses on Windows Platform only. We deliver on-demand hosting solutions including Shared hosting, Reseller Hosting, Cloud Hosting, Dedicated Servers, and IT as a Service for companies of all sizes.