angularjs - Angular - Form Validation Custom Directive, how to pass result to another element for the error display? -

so i'm building myself new directive form validation , got working except 1 thing believe not coded. know form validation directive validate <input ngx-validation="alpha"> how pass error text, occurs inside directive other element (a bootstrap <span class="text-danger">{{ validation_errors["input1"] }}</span> right below input? moment, created scope variable exist inside controller , work...until user forgets create actual variable... how suppose share information 1 element another? way, variable array holding input error messages... here code @ moment:

<!-- html form --> <input type="text" class="form-control" name="input1" ng-model="form1.input1" ngx-validation="alpha|min_len:3|required" /> <span class="validation text-danger">{{ validation_errors["input1"] }}</span> 

js code

// controller  myapp.controller('ctrl', ['$scope', '$translate', function ($scope, $translate) {   $scope.form1 = {};   $scope.validation_errors = [];  // scope variable }]);  // creation of directive angular.module('ghiscoding.validation', ['pascalprecht.translate'])   .directive('ngxvalidation', function($translate){     return{       require: "ngmodel",       link: function(scope, elm, attrs, ctrl) {         // ngx-validation attribute           var validationattr = attrs.ngxvalidation;          // rest of validation code...         // ...          if(!isfieldvalid && ctrl.$dirty) {             scope.validation_errors[ctrl.$name] = message;         }else {             scope.validation_errors[ctrl.$name] = "";         }          return value;         };          ctrl.$parsers.unshift(validator);         ctrl.$formatters.unshift(validator);       }     };   }); 

if @ code, scope variable in question use called $scope.validation_errors = []; created in controller, without creating it, of course fail. can see github, made available , wish lot of people use angular-validation directive because it's easy way i've done :) see github angular-validation

edit
make clear, validation part of directive working fine. real problem simply, how pass error message directive (which directive connected <input>) , pass error message (a simple string) <span> 2 different elements, how can talk element within directive, how can bind? @ moment i'm using global variable, needs exist in controller, isn't good... new angular , i'm struggling directives, please provide code. lot help.

answer
have full angular directive, last piece of code solution answered here... since <span> displaying error message after input, can update next element text native angular jqlite...that's it, simple that... here new html code

<!-- html --> <input type="text" name="input1" validation="alpha|min_len:3|required" /> <span class="validation text-danger"></span> 

// previous piece of code replace if(!isfieldvalid && ctrl.$dirty) {     scope.validation_errors[ctrl.$name] = message; }  // replaced if(!isfieldvalid && ctrl.$dirty) {     elm.next().text(message); } 

you should same thing other built-in form validation directives do: use ngmodelcontroller's $setvalidity method, using own key. span able check if error exists validation key using

theformname.theinputname.$error.yourvalidationkey 

and validity of field, validity of enclosing form, automatically handled angular.

see http://docs.angularjs.org/api/ng.directive:ngmodel.ngmodelcontroller.