You would have to use $observe or $watch to monitor changes to the attribute, but the value of the attribute would have to be interpolated ({{}})
Example:
<input type="text" cv-tooltip="{{right}}" cv-error-on-blur />
attrs.$observe('cvTooltip', function(newValue, oldValue) {
});
Could you just rewrite it into a single directive?
mainApp.directive('cvTooltip', function () {
var optionDictionary = {
'right': {
position: {
my: 'center left',
at: 'right center'
},
style: {
tip: {
corner: 'left center',
height: 10
}
}
},
'left': {
position: {
my: 'center right',
at: 'left center'
},
style: {
tip: {
corner: 'right center',
height: 10
}
}
}
};
return {
restrict: 'A',
require:"^ngController",
link: function (scope, element, attrs, controller) {
var initialValue = attrs.cvTooltip;
console.log(initialValue);
var options = {
style: {
tip: {
width: 13
}
},
position: {
target: element
}
};
if (controller.$dirty && controller.$invalid) {
element.addClass('error');
var defaults = optionDictionary['left'];
$.extend(options, defaults);
element.qtip('destroy');
element.qtip(options);
} else {
element.removeClass('error');
var defaults = optionDictionary['right'];
$.extend(options, defaults);
element.qtip('destroy');
element.qtip(options);
}
}
}