title: Angular1.5 custom directive sets ng-dirty after click
body: <p>I have built some custom directives for inputs.
  I want to use them and show an error message if the entered value isn't valid. 
  Consequently every ng-message is shown on the condition "form.input.$dirty". </p>
  
  <p>If i click on inputs which uses my custom directive it becomes dirty. But I think it shouldn't. Inputs which use required or/and max just doesn't show the message and aren't dirty. So I suggest that the error is in my directive. </p>
  
  <p>one custom directive:</p>
  
  <pre><code>{
    restrict: 'A',
    require: 'ngModel',
    scope: {
      ngModel: '=',
      countryCode: '&lt;'
    },
    link: function (scope, element, attrs, ctrl) {
  
      middlewareConfigService.getCountries().then(function (response) {
        scope.countries = response.data;
        ctrl.$validate()
      })
  
  
      var isValidBic = function isValidBic(value) {
        if (!value)
          return true;
  
        value = value.toUpperCase();
        if (!(value.length === 8 || value.length === 11)) {
          return false;
        }
  
        if (scope.countryCode) {
          return value.substring(4, 6) === scope.countryCode
        }
  
        if (scope.countries) {
          return scope.countries.filter(function (country) {
              return country.key === value.substring(4, 6)
            }).length &gt; 0;
        }
        return true;
      };
      ctrl.$validators.ngBic = function (modelValue) {
        return isValidBic(modelValue);
      };
    }
  }
  </code></pre>
  
  <p>Is something missing? Is the directive the problem? </p>
  
  <p>Thank you in advance</p>