match directive

match.js

'use strict';

angular.module('crmApp')
.directive('match', function () {
  return {
    restrict: 'A',
    require: 'ngModel',
    scope: {
      match: '='
    },
    link: function (scope, element, attrs, ngModel) {
      scope.modelValue = '';
      scope.matchValue = '';

      scope.validate = function () {
        var isValid = scope.modelValue === scope.matchValue;
        ngModel.$setValidity('match', isValid); // TODO: assigns undefined to the model. why?

        return isValid;
      };

      // watch for changes in ngModel
      scope.$watch(function () {return ngModel.$viewValue;}, function (value) {
        scope.modelValue = value;
        scope.validate();
      });

      // watch for changes in match
      scope.$watch('match', function (value) {
        scope.matchValue = value || ''; // set to empty string if undefined
        scope.validate();
      });
    }
  };
});