For example, UI Bootstrap has a directive called 'typeahead' that suggests values for a field. Let's say I want to make a directive that I can use as an attribute for an element that will cause colours to be suggested for that element.
Here's an attempt that fails...
Directive:
angular.module('myApp')
.directive('suggestcolors', function () {
return {
compile: function compile(element, attrs) {
attrs.$set("typeahead", "color for color in ['red', 'blue', 'green']");
}
};
});
View:
<textarea ng-model="foo" suggestcolors></textarea>
When I inspect the textarea, the attribute has been set, but it doesn't do anything. The same thing happens if I move the change to attrs to the link function. Setting the typeahead attribute directly in the view works as expected:
<textarea ng-model="foo" typeahead="color for color in ['red', 'blue', 'green']"></textarea>
(But I want to be able to insert this attribute dynamically, for reasons of DRY. My actual use case is more complicated than this.)
A similar question was asked here (about dynamically adding ng-click behaviour in the compile step), but never directly answered.
