AngularJS: Adding other directives via directive -
i'm trying create simple pop-up indicator when form input has invalid value.
right now, have service handles setting form values invalid based upon results of call server:
var item = form[error.propertyname]; item.$setvalidity('error', false); item.errormessage = error.message;
so on these models i'm setting property called 'errormessage' whatever sent server.
to message popup, i've created directive uses angular-ui bootstrap tooltip directive:
myapp.directive('validationpopup', function ($compile) { return { restrict: 'a', priority: 10000, terminal: true, require: '^form', compile: function compile($element, $attrs) { delete ($attrs['validationpopup']); $element.removeattr('validation-popup'); $element.attr('tooltip', '{{errormessage}}'); $element.attr('tooltip-trigger', 'focus'); return { pre: function (scope, element, attrs, formctrl) { }, post: function (scope, element, attrs, formctrl) { $compile(element)(scope); scope.$watch(function () { return (formctrl[attrs.name] == undefined) ? undefined : formctrl[attrs.name].$invalid; }, function (invalid) { if (invalid != undefined) { scope.errormessage = formctrl[attrs.name].errormessage || ''; } }); } }; } };
since don't have lot of experience making directives, , since i've cobbled various other answers on here, question is correct way of adding other directives existing element? appears working correctly; however, wasn't sure if going run issues down line (or performance problems).
Comments
Post a Comment