title: Angular: difference when using template or templateUrl
body: <p>I'm running into a strange issue when using the <code>template</code> attribute instead of the <code>templateUrl</code> one.</p>
  
  <p>In case of the latter, I can define multiple directives with isolated scope or the <code>transclude</code> option on a single element. This works as expected and I don't get any errors.</p>
  
  <p>However when simply copying the template and setting it to <code>template</code> in the directive, Angular suddenly starts complaining about multiple directives requesting isolated scope or transclusion on the same element.</p>
  
  <p>See this <a href="http://plnkr.co/edit/BMNOyldd4BQACeaQriL9?p=preview" rel="nofollow">plunkr</a> of mine. It throws an error in the console. However, if you would replace (in scripts.js)</p>
  
  <pre><code>template: "&lt;ul kendo-menu k-orientation=\"'vertical'\" k-direction=\"'right'\"&gt;&lt;/ul&gt;",
  </code></pre>
  
  <p>with</p>
  
  <pre><code>templateUrl: 'menu.html'
  </code></pre>
  
  <p>the directive works (try right clicking on the text). The content of the HTML file is <strong>exactly</strong> the same as in the string.</p>
  
  <p>Has anyone got the slightest clue why this inconsistency occurs?</p>
  
  <p><strong>Edit</strong>: 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. </p>