Let's say I've declared three class-restricted directives "am-wat", "am-foo", and "am-bar", that each augment the attached element with some behavior, e.g.:
<div am-wat="some data" am-foo="other data" am-bar="lol">
Yadda yadda yadda
</div>
Is there a way to write a directive that mixes in the behavior of the three directives, e.g.:
<div am-trifecta="trifecta args">
Yadda yadda yadda
</div>
such that the trifecta directive invokes the behavior of each of the three directives on that div, passing each directive some args that the trifecta directive came up with? Can it be done in without requiring an intermediate DOM element being added, which might complicated or screw up existing styles?
@Blesh very cool, thanks for going through it all.
As I mentioned on Twitter (i'll try to keep the rest of the discussion here), I think you meant to write
transclude
instead oftranspile
.Also, I don't understand why you'd have more flexibility with
am-trifect
being element-restricted; it's my understanding that the angular compiler just uses directive restrictions to determine a match and decide whether a directive's behavior gets applied to any given element, regardless of whether the match is class/element-based.As for scopes, it'd be desirable if each directive got its own isolate scope, and I wouldn't have been surprised if it worked that way. Seems strange that scope would be decided in a somewhat non-deterministic manner based on element rather than each directive getting its own, but I'm sure there's something I'm not considering here.