Angular 1.6.5 Template

by nomadev

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular.js"></script>
<script src="https://code.angularjs.org/1.6.5/angular-animate.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>
<div ng-app="testApp" ng-controller="testController">

  <form name="form" autocomplete="off">
    {{hi}} from angular
    <pre>
      {{form.newPassword | json}}
    </pre>
    <pre>
      {{form.repeatPassword | json}}
    </pre>

    <div>
    <input 
           ng-model="model.newPassword"
           name="newPassword"
           class="form-registrazione__input"
           type="text"
           minlength="8"
           maxlength="20"
           required
           >
    <div>

    <input 
           ng-model="model.repeatPassword"
           name="repeatPassword"
           type="text"
           autocomplete="off"
           ltm-validators="{ samePwd : '$value === model.newPassword'}"
           ltm-force-revalidate-on-change="model.newPassword"
           required>
    </div>
  </form>
</div>

JavaScript

var lodash = _.noConflict();

var app = angular.module('testApp', []);
app.directive('ltmValidators', function(){
		
		var rePattern = /^\/(.*)\/$/;
		
		function createReValidator(re){
			return function(modelValue, viewValue){
				var toValidate = modelValue || viewValue;
				if (toValidate === "")
					return true;
				
				return re.test(toValidate);
			}
		}
		
		
		return {
			require : 'ngModel',
			scope   : false,
			link    : function($scope, $element, $attrs, ngModelCtrl) {
				// Manually reads the value to avoid using an isolated scope.
				var cfg = $scope.$eval($attrs.ltmValidators);
				if (!cfg){
					console.warn("multiValidator attached to element", $element, "has no constraints to attach.");
					return;
				}
				
				lodash.forEach(cfg, function(value, key){
					if (typeof value === "function")
						return ngModelCtrl.$validators[key] = value;
					
					if (value instanceof RegExp)
						return ngModelCtrl.$validators[key] = createReValidator(value);
					
					// If string is wrapped among slashes we compile it as RE, otherwise we
					// eval it as an angular expression on the scope.
					if (typeof value === "string"){
						var match = rePattern.exec(value);
						if (match != null){
							return ngModelCtrl.$validators[key] = createReValidator(new RegExp(match[1]));
						}
						else{
							return ngModelCtrl.$validators[key] = function(modelValue, viewValue){
								var toValidate = modelValue || viewValue;
								if (toValidate === "")
									return true;
								
								return $scope.$eval(value, { '$value' : toValidate });
							}
						}
					}
						
					
					
					console.warn("Unknow value type for key:", key);
				});
				
			}
		}
	})



app.directive('ltmForceRevalidateOnChange', function($rootScope) {
	
  return {
  		require: '^ngModel',
  		scope: false,
      link: ['$scope', '$element', '$attrs', '$ctrl', function($scope, $element, $attrs, $ctrl) {
        $scope.$watch($attrs.ltmForceRevalidateOnChange,...