AngularJS Password Strength Validation

<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" href="style.css">
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
  <script>
    var app = angular.module("StrengthValidationApp", []);
    app.controller("StrengthValidationCtrl", 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";
        } else if (mediumRegularExp.test(value)) {
          $scope.checkpwdStrength["background-color"] = "orange";
        } else {
          $scope.checkpwdStrength["background-color"] = "red";
        }
      };

    });
  </script>
</head>

<body ng-app="StrengthValidationApp">
  <div ng-controller="StrengthValidationCtrl">
    <div>
      <h3>Check password strength using RegEx!</h3> 
    </div>
    <div>
      <div ng-style="checkpwdStrength"></div>
      <input type="password" ng-model="userPassword" ng-change="validationInputPwdText(userPassword)" class="class1"/>
    </div>

  </div>
</body>

</html>

// Code goes here

/* Styles go here */

.class1{
  height:25px;
  width :200px;
}