I'm running into a strange issue when using the template
attribute instead of the templateUrl
one.
In case of the latter, I can define multiple directives with isolated scope or the transclude
option on a single element. This works as expected and I don't get any errors.
However when simply copying the template and setting it to template
in the directive, Angular suddenly starts complaining about multiple directives requesting isolated scope or transclusion on the same element.
See this plunkr of mine. It throws an error in the console. However, if you would replace (in scripts.js)
template: "<ul kendo-menu k-orientation=\"'vertical'\" k-direction=\"'right'\"></ul>",
with
templateUrl: 'menu.html'
the directive works (try right clicking on the text). The content of the HTML file is exactly the same as in the string.
Has anyone got the slightest clue why this inconsistency occurs?
Edit: to avoid confusion, I need the transclude option to be there as I'd like to reuse this element and be able to configure what elements to shown on each place it is used separately.
Apparently this inconsistency has been fixed in the newer versions of Angular.
We're using 1.0.8
and the correct behaviour (throwing the error when multiple directives require transclusion on the same element) only occurs when using the template
option. When using the templateUrl
option, the error is not thrown and the directive works as expected (which still boggles my mind)
Edit: fixed it using the compile
function and removing the replace
option. Working example here.